<template>
	<div class="flex flex-col">
		<a-card
			class="min-h-[68px] rounded my-[10px]"
			:body-style="{ padding: '12px 30px 50px', height: '100%' }"
			:bordered="false"
            @click="hideDropdown"
		>
			<!-- 头部返回列表功能 -->
			<template #extra>
				<a-button
					class="border-none"
					icon="rollback"
					@click="$router.go(-1)"
					>{{ $t('app.setting.themecolor.rr99') }}
				</a-button>
			</template>
			<!-- 正文头部 -->
			<div slot="title">
				<a-space>
					<div class="ty"></div>
					{{ $t(pageTitle) }}
				</a-space>
			</div>
			<a-form :form="form" layout="vertical">
				<!-- 注册识别风险 -->
				<a-form-item label="ID" v-show="false" class="hidden">
					<a-input v-decorator="['Id']" disabled />
				</a-form-item>
				<a-row>
					<a-col :span="12" v-if="$route.query.state !== 'add'">
						<a-form-item
							style="margin: 0"
							:label="$t('user.password.strength.medium66667777')"
						>
							<a-input
								v-decorator="['RpaId']"
								placeholder="RPA001"
								disabled
								style="width: 390px"
							/>
						</a-form-item>
					</a-col>
					<a-col :span="12">
						<!-- Rpa名称 -->
						<a-form-item
							:label="$t('user.password.strength.medium12121212')"
						>
							<!-- 内容信息 -->
							<a-input
								:placeholder="
									$t('user.password.strength.medium222')
								"
								:disabled="disabled"
								style="width: 390px"
								v-decorator="[
									'RpaName',
									{
										rules: [
											{
												required: true,
												message: $t(
													'user.password.strength.medium2226677'
												),
											},
										],
									},
								]"
							/>
							<!-- 提示信息 -->
							<a-tooltip>
								<template slot="title">
									{{
										$t(
											'user.verification-code.required111566110577371442281431444'
										)
									}}
								</template>
								<a-icon
									type="question-circle"
									style="margin-left: 10px"
								></a-icon>
							</a-tooltip>
						</a-form-item>
					</a-col>
					<a-col :span="12">
                            <a-form-item :label="$t('user.login.remember-me121213')">
                                <div style="display: flex;align-items: center;">
                                    <div style="width:390px;border: 1px solid #ccc;line-height: 32px;border-radius: 5px;">
                                        <div class="Div_ler" @click.stop="hoverOver" 
                                            :placeholder="$t('user.login.forgot-password')">
                                            <template v-for="(tag, index) in RpaDataTay">
                                                <a-tooltip v-if="tag.length > 20" :key="tag" :title="tag">
                                                    <a-tag :key="tag" :closable="true" @close="() => handleClose(tag)">
                                                        {{ `${tag.slice(0, 20)}...` }}
                                                    </a-tag>
                                                </a-tooltip>
                                                <a-tag v-else :key="tag" :closable="true" @close="() => handleClose(tag)">
                                                    {{ tag }}
                                                </a-tag>
                                             </template>
                                             <a-input
                                                v-if="inputVisible"
                                                ref="input"
                                                type="text"
                                                size="small"
                                                :style="{ width: '78px' }"
                                                :value="inputValue"
                                                @change="handleInputChange"
                                                @blur="handleInputConfirm"
                                                @keyup.enter="handleInputConfirm"
                                                placeholder="Other:"
                                              />
                                        </div>
                                        <ul class="Ul_st"  v-if="isHovered" >
                                            <li v-for="item in systemControllerSourceData" @click="hoverOut(item)" :value="item.value"  :key="item.label + item.value" class="Ulli">
                                               <div style="display: flex;justify-content: space-between;">
                                                    <span>
                                                        {{ item.label }}
                                                    </span>
                                                    <span style="color: #1890ffb5;font-size: 12px;" v-if="item.label == 'Other' && Others.length>0 ">
                                                        +{{Others.length}}
                                                    </span>
                                               </div>
                                            </li>
                                        </ul>
                                    </div>
                                    <a-tooltip>
                                        <template slot="title">
                                            {{
                                                $t(
                                                    'user.verification-code.required111566110577371442281431333'
                                                )
                                            }}
                                        </template>
                                        <a-icon type="question-circle" style="margin-left: 10px"></a-icon>
                                    </a-tooltip>
                                </div>
							</a-form-item>
                        </a-col>
				</a-row>
				<a-row>
					<a-col :span="12">
						<!-- 业务负责人 -->
						<a-form-item
							:label="$t('user.password.strength.low1114545')"
							:colon="false"
							labelAlgin="left"
						>
							<a-select
								:placeholder="
									$t('user.password.strength.low111222')
								"
								show-search
								v-model="inputValue"
								@search="filte1rOption"
								:showArrow="false"
								:filter-option="false"
								allowClear
								v-decorator="[
									'RpaLeaderMaster',
									{
										rules: [
											{
												required: true,
												message: $t(
													'user.password.strength.low111222234534'
												),
											},
										],
									},
								]"
								style="width: 390px"
								:disabled="disabled"
							>
								<a-select-option
									v-for="item in userList"
									:value="item.value"
									:key="item.label + item.value"
								>
									{{ item.label }}
								</a-select-option>
							</a-select>
						</a-form-item>
					</a-col>
					<a-col :span="12">
						<!-- 业务备选负责人 -->
						<a-form-item
							:label="$t('user.password.strength.low222q3214')"
							:colon="false"
							labelAlgin="left"
						>
							<a-select
								:placeholder="
									$t('user.password.strength.low22222212')
								"
								v-decorator="['RpaLeaderRetinue']"
								show-search
								:default-active-first-option="false"
								v-model="inputValue"
								@search="filte1rOption"
								:showArrow="false"
								:filter-option="false"
								style="width: 390px"
								allowClear
								:disabled="disabled"
							>
								<a-select-option
									v-for="item in userList"
									:value="item.value"
									:key="item.label + item.value"
								>
									{{ item.label }}
								</a-select-option>
							</a-select>
						</a-form-item>
					</a-col>
				</a-row>
				<a-row>
					<a-col :span="12">
						<!-- 业务主要目的 -->
						<a-form-item>
							<span slot="label" style="white-space: normal">{{
								$t('user.verification-code.required1122')
							}}</span>

							<a-select
								:placeholder="$t('bussic.target.select')"
								:showArrow="false"
								:filter-option="false"
								allowClear
								@change="changePurposeSelect"
								v-decorator="[
									'RpaObjective',
									{
										rules: [
											{
												required: true,
												message: $t(
													'user.verification-code.required11oo3245'
												),
											},
										],
									},
								]"
								style="width: 390px"
								:disabled="disabled"
							>
								<a-select-option
									v-for="item in [
										'bussic.target.a',
										'bussic.target.b',
										'bussic.target.c',
										'bussic.target.d',
										'bussic.target.e',
										'bussic.target.f',
										'bussic.target.g',
										'bussic.target.h',
									]"
									:value="item"
									:key="item"
									:title="$t(item)"
								>
									{{ $t(item) }}
								</a-select-option>
							</a-select>
						</a-form-item>
					</a-col>
					<a-col :span="12" v-if="otherPurpose">
						<!-- 业务目的的补充 -->
						<a-form-item :label="$t('bussic.target.supplement')">
							<a-input
								:placeholder="
									$t('user.password.strength.low111222444')
								"
								show-search
								v-model="inputValue"
								@search="filte1rOption"
								:showArrow="false"
								:filter-option="false"
								allowClear
								v-decorator="[
									'RpaObjectiveOther',
									{
										rules: [
											{
												required: true,
												message: $t(
													'user.password.strength.low11122223453455'
												),
											},
										],
									},
								]"
								style="width: 390px"
								:disabled="disabled"
							/>
						</a-form-item>
					</a-col>
				</a-row>
				<a-row>
					<a-col :span="12">
						<!-- 请说明业务活动发生的频率 -->
						<a-form-item
							:label="
								$t(
									'user.verification-code.required11156611057737144123123'
								)
							"
						>
							<a-select
								:placeholder="
									$t(
										'user.verification-code.required111566110577371446'
									)
								"
								v-decorator="[
									'RpaProcessingActivityCycle',
									{
										rules: [
											{
												required: true,
												message: $t(
													'user.verification-code.required111566110577371449'
												),
											},
										],
									},
								]"
								show-search
								option-filter-prop="children"
								:filter-option="filterOption"
								style="width: 390px"
								allowClear
								:disabled="disabled"
							>
								<a-select-option
									v-for="item in RpaProcessingActivityCycleList"
									:value="item.value"
									:key="item.label + item.value"
								>
									{{ $t(item.label) }}
								</a-select-option>
							</a-select>
						</a-form-item>
					</a-col>
				</a-row>
				<a-row>
					<a-col :span="12">
						<!-- 数据处理频率 -->
						<a-form-item>
							<span slot="label">{{
								$t(
									'user.verification-code.required111566110577371447'
								)
							}}</span>
							<a-input
								:placeholder="
									$t(
										'user.verification-code.required111566110577371448'
									)
								"
								style="width: 390px"
								v-decorator="[
									'RpaFrequency',
									{
										rules: [
											{
												required: true,
												message: $t(
													'user.verification-code.required11156611057737144966666'
												),
											},
										],
									},
								]"
								:disabled="disabled"
							/>
							<!-- 提示信息 -->
							<a-tooltip>
								<template slot="title">
									{{
										$t(
											'user.verification-code.required111566110577371442281431222'
										)
									}}
								</template>
								<a-icon
									type="question-circle"
									style="margin-left: 10px"
								></a-icon>
							</a-tooltip>
						</a-form-item>
					</a-col>
					<a-col :span="12">
						<!-- 数据存储期限 -->
						<a-form-item
							:label="
								$t(
									'user.verification-code.required111566110577371441167547'
								)
							"
						>
							<a-input
								v-decorator="[
									'RpaStoragePeriod',
									{
										rules: [
											{
												required: true,
												message: $t(
													'user.verification-code.required111566110577376'
												),
											},
										],
									},
								]"
								:placeholder="
									$t(
										'user.verification-code.required1115661105773714412'
									)
								"
								:disabled="disabled"
								style="width: 390px"
							/>
							<!-- 提示信息 -->
							<a-tooltip>
								<template slot="title">
									{{
										$t(
											'user.verification-code.required11156611057737144228143122299'
										)
									}}
								</template>
								<a-icon
									type="question-circle"
									style="margin-left: 10px"
								></a-icon>
							</a-tooltip>
						</a-form-item>
					</a-col>
				</a-row>
				<a-row>
					<a-col :span="12">
						<!-- 涉及个人信息主体的数量 -->
						<a-form-item
							:label="
								$t(
									'user.verification-code.required1115661105773714413123'
								)
							"
						>
							<a-select
								v-decorator="[
									'RpaNumber',
									{
										rules: [
											{
												required: true,
												message: $t(
													'user.verification-code.required1115661105773714414'
												),
											},
										],
									},
								]"
								show-search
								option-filter-prop="children"
								:filter-option="filterOption"
								:placeholder="
									$t(
										'user.verification-code.required1115661105773714415'
									)
								"
								allowClear
								style="width: 390px"
								:disabled="disabled"
							>
								<a-select-option
									v-for="items in RpaNumberList"
									:value="items.value"
									:key="items.label + items.value"
									>{{ $t(items.label) }}
								</a-select-option>
							</a-select>
						</a-form-item>
					</a-col>
					<a-col :span="12">
						<!-- 涉及敏感个人信息主体的数量 -->
						<a-form-item
							:label="
								$t(
									'user.verification-code.required1115661105773714416'
								)
							"
						>
							<a-select
								v-decorator="[
									'RpaSensitiveNumber',
									{
										rules: [
											{
												required: true,
												message: $t(
													'user.verification-code.required1115661105773714418'
												),
											},
										],
									},
								]"
								show-search
								option-filter-prop="children"
								:filter-option="filterOption"
								:placeholder="
									$t(
										'user.verification-code.required1115661105773714417'
									)
								"
								style="width: 390px"
								allowClear
								:disabled="disabled"
							>
								<a-select-option
									v-for="items in RpaSensitiveNumberList"
									:value="items.value"
									:key="items.label + items.value"
									>{{ $t(items.label) }}
								</a-select-option>
							</a-select>
						</a-form-item>
					</a-col>
				</a-row>
				<!-- 处理活动的系统或网络环境 -->
				<a-row>
					<a-col :span="12">
						<!-- 本次业务活动是否涉及线上处理活动 -->
						<a-form-item
							:label="
								$t(
									'user.verification-code.required1115661105773714422'
								)
							"
						>
							<a-select
								v-decorator="[
									'RpaCollectionChannels',
									{
										rules: [
											{
												required: true,
												message: $t(
													'user.verification-code.required11156611057737144224545'
												),
											},
										],
									},
								]"
								@change="onChanges"
								show-search
								option-filter-prop="children"
								:filter-option="filterOption"
								:placeholder="
									$t(
										'user.verification-code.required11156611057737144221'
									)
								"
								allowClear
								style="width: 390px"
								:disabled="disabled"
							>
								<a-select-option
									v-for="items in RpaCollectionChannelsList"
									:value="items.value"
									:key="items.label + items.value"
									>{{ $t(items.label) }}
								</a-select-option>
							</a-select>
							<!-- 提示信息 -->
							<a-tooltip>
								<template slot="title">
									{{
										$t(
											'user.verification-code.required11156611057737144228143122288'
										)
									}}
								</template>
								<a-icon
									type="question-circle"
									style="margin-left: 10px"
								></a-icon>
							</a-tooltip>
						</a-form-item>
					</a-col>
					<a-col :span="12" v-if="changvalue == 1">
						<a-form-item
							:label="
								$t(
									'user.verification-code.required1115661105773714419'
								)
							"
						>
							<a-select
								v-decorator="[
									'RpaSystemNetwork',
									{
										rules: [
											{
												required: true,
												message: $t(
													'user.verification-code.required1115661105773714421'
												),
											},
										],
									},
								]"
								show-search
								option-filter-prop="children"
								:filter-option="filterOption"
								:placeholder="
									$t(
										'user.verification-code.required1115661105773714420'
									)
								"
								allowClear
								style="width: 390px"
								:disabled="disabled"
							>
								<a-select-option
									v-for="items in RpaSystemNetworkList"
									:value="items.value"
									:key="items.label + items.value"
									>{{ $t(items.label) }}
								</a-select-option>
							</a-select>
						</a-form-item>
					</a-col>
				</a-row>
				<a-row>
					<a-col :span="12">
						<!-- 私隐影响评估 -->
						<a-form-item
							:label="$t('user.verification-code.requiredLuck11')"
						>
							<a-radio-group
								v-decorator="['RpaIfCompletedPIA']"
								v-model="initFromData.RpaIfCompletedPIA"
								:disabled="disabled"
							>
								<a-radio :value="0">{{
									$t(
										'user.verification-code.requiredLuck11no'
									)
								}}</a-radio>
								<a-radio :value="1">{{
									$t(
										'user.verification-code.requiredLuck11yes'
									)
								}}</a-radio>
							</a-radio-group>
						</a-form-item>
					</a-col>
				</a-row>
				<div v-if="initFromData.RpaIfCompletedPIA == 0">
					<a-row>
						<a-col :span="24">
							<div
								style="
									color: rgba(0, 0, 0, 0.85);
									padding: 0 0 8px;
								"
							>
								<span
									style="
										font-family: SimSun, sans-serif;
										margin-right: 4px;
										color: #f5222d;
										font-size: 14px;
										line-height: 1;
									"
									>*</span
								>
								{{
									$t(
										'user.verification-code.requiredtuoxuanone111'
									)
								}}
							</div>
							<a-form-item>
								<p style="color: rgba(0, 0, 0, 0.85)">
									{{
										$t(
											'user.verification-code.required11156611057737144222'
										)
									}}
								</p>
								<!-- 文件上传 -->
								<a-button
									v-if="disabled"
									disabled
									icon="upload"
								>
									{{
										$t(
											'user.verification-code.required111566163'
										)
									}}
								</a-button>
								<a-upload
									name="file"
									accept=".png, .jpg, .jpeg, .gif, .txt, .pdf, .doc, .docx, .xlsx, .xls, .ppt, .pptx, .vsd, .vsdx, .vssx, .vstx, .vsdm, .vssm, .vstm, .zip, .tar, .rar, .msg"
									:beforeUpload="beforeUpload"
									:file-list="fileLists"
									:remove="fn"
									:customRequest="handleChange"
									v-else
								>
									<a-button>
										<a-icon type="upload" />
										{{
											$t(
												'user.verification-code.required111566163'
											)
										}}
									</a-button>
								</a-upload>
							</a-form-item>
							<ul>
								<li
									v-for="itemName in listNameArr"
									:key="index"
								>
									{{ itemName }}
								</li>
							</ul>
							<i style="font-size: 12px; margin-bottom: 8px">{{
								$t('user.verification-code.support')
							}}</i>
							<a-form-item>
								<span
									slot="label"
									style="white-space: normal"
									>{{
										$t(
											'user.verification-code.required11156611057737144223'
										)
									}}</span
								>
								<a-textarea
									v-decorator="['RpaDataFlowDiagramDescribe']"
									v-model="
										initFromData.RpaDataFlowDiagramDescribe
									"
									:auto-size="{ minRows: 3, maxRows: 7 }"
									style="width: 490px"
									:placeholder="
										$t(
											'user.verification-code.required11156611057737144224'
										)
									"
									:disabled="disabled"
								/>
							</a-form-item>

							<div
								style="
									color: rgba(0, 0, 0, 0.85);
									padding: 0 0 8px;
								"
							>
								<span
									style="
										font-family: SimSun, sans-serif;
										margin-right: 4px;
										color: #f5222d;
										font-size: 14px;
										line-height: 1;
									"
									>*</span
								>
								{{
									$t(
										'user.verification-code.requiredtuoxuanone222'
									)
								}}
							</div>
							<a-form-item>
								<p style="color: rgba(0, 0, 0, 0.85)">
									{{
										$t(
											'user.verification-code.required11156611057737144225'
										)
									}}
								</p>
								<!-- 文件上传 -->
								<a-button
									v-if="disabled"
									disabled
									icon="upload"
								>
									{{
										$t(
											'user.verification-code.required111566163'
										)
									}}
								</a-button>
								<a-upload
									name="file"
									accept=".png, .jpg, .jpeg, .gif, .txt, .pdf, .doc, .docx, .xlsx, .xls, .ppt, .pptx, .vsd, .vsdx, .vssx, .vstx, .vsdm, .vssm, .vstm, .zip, .tar, .rar, .msg"
									:beforeUpload="beforeUpload"
									:file-list="RpaSystemFileLists"
									:multiple="true"
									:customRequest="RpaSystemHandleChange"
									:remove="fn1"
									v-else
								>
									<a-button>
										<a-icon type="upload" />
										{{
											$t(
												'user.verification-code.required111566163'
											)
										}}
									</a-button>
								</a-upload>
							</a-form-item>
							<ul>
								<li
									v-for="itemName in listNameArr2"
									:key="index"
								>
									{{ itemName }}
								</li>
							</ul>
							<i style="font-size: 12px; margin-bottom: 8px">{{
								$t('user.verification-code.support')
							}}</i>
							<a-form-item>
								<span
									slot="label"
									style="white-space: normal"
									>{{
										$t(
											'user.verification-code.required1115661105773714422333'
										)
									}}</span
								>
								<a-textarea
									v-decorator="[
										'RpaSystemArchitectureDescribe',
									]"
									v-model="
										initFromData.RpaSystemArchitectureDescribe
									"
									:auto-size="{ minRows: 3, maxRows: 7 }"
									style="width: 490px"
									:placeholder="
										$t(
											'user.verification-code.required1115661105773714422812'
										)
									"
									:disabled="disabled"
								/>
							</a-form-item>
						</a-col>
					</a-row>
					<a-row>
						<a-col :span="24">
							<div style="display: flex">
								<span
									style="
										font-family: SimSun, sans-serif;
										margin-right: 4px;
										color: #f5222d;
										font-size: 14px;
										line-height: 1;
									"
									>*</span
								>
								<a-form-item
									:label="
										$t(
											'user.verification-code.requiredLuck15'
										)
									"
								>
									<a-checkbox
										v-decorator="[
											'RpaNoPIOrImportantInvolved',
										]"
										v-model="
											initFromData.RpaNoPIOrImportantInvolved
										"
										:disabled="disabled"
									>
										<span>{{
											$t(
												'user.verification-code.requiredLuck2311'
											)
										}}</span>
										<a-popover
											title="Personal Information"
											placement="bottom"
											trigger="click"
											:overlayStyle="{ width: '30%' }"
										>
											<template
												#content
												style="width: 300px"
											>
												<p>
													{{
														$t(
															'user.verification-code.requiredLuck16'
														)
													}}
												</p>
											</template>
											<a-button
												type="link"
												style="padding: 0 2px"
												>{{
													$t(
														'user.verification-code.requiredLuck2333'
													)
												}}</a-button
											>
										</a-popover>
										<span>{{
											$t(
												'user.verification-code.requiredLuck2322'
											)
										}}</span>
										<a-popover
											title="Important Data"
											placement="bottom"
											trigger="click"
											:overlayStyle="{ width: '30%' }"
										>
											<template
												#content
												style="width: 300px"
											>
												<p>
													{{
														$t(
															'user.verification-code.requiredLuck17'
														)
													}}
												</p>
												<p>
													{{
														$t(
															'user.verification-code.requiredLuck18'
														)
													}}
												</p>
												<p>
													{{
														$t(
															'user.verification-code.requiredLuck19'
														)
													}}
												</p>
												<p>
													{{
														$t(
															'user.verification-code.requiredLuck20'
														)
													}}
												</p>
												<p>
													{{
														$t(
															'user.verification-code.requiredLuck21'
														)
													}}
												</p>
												<p>
													{{
														$t(
															'user.verification-code.requiredLuck22'
														)
													}}
												</p>
												<p>
													{{
														$t(
															'user.verification-code.requiredLuck23'
														)
													}}
												</p>
											</template>
											<a-button
												type="link"
												style="padding: 0 2px"
												>{{
													$t(
														'user.verification-code.requiredLuck2344'
													)
												}}</a-button
											>
										</a-popover>
										{{
											$t(
												'user.verification-code.requiredLuck2355'
											)
										}}
									</a-checkbox>
								</a-form-item>
							</div>
						</a-col>
					</a-row>
					<a-row v-if="initFromData.RpaNoPIOrImportantInvolved">
						<div style="display: flex">
							<span
								style="
									font-family: SimSun, sans-serif;
									margin-right: 4px;
									color: #f5222d;
									font-size: 14px;
									line-height: 1;
								"
								>*</span
							>
							{{ $t('user.verification-code.requiredLuck1515') }}
						</div>

						<a-col :span="24">
							<a-form-item>
								<a-textarea
									v-decorator="[
										'RpaNoPIDescProcessedData',
										{
											rules: [
												{
													required: true,
													message: $t(
														'user.verification-code.requiredLuck15'
													),
												},
											],
										},
									]"
									v-model="
										initFromData.RpaNoPIOrImportantInvolved
									"
									:auto-size="{ minRows: 3, maxRows: 7 }"
									style="width: 490px"
									:placeholder="
										$t(
											'user.verification-code.requiredLuck1555'
										)
									"
									:disabled="disabled"
								/>
							</a-form-item>
						</a-col>
					</a-row>
					<!-- 新增数据字段内容 -->
					<div v-if="!initFromData.RpaNoPIOrImportantInvolved">
						<!-- 详情数据 -->
						<a-row>
							<a-col :span="24" style="margin-left: -50px">
								<a-form-item
									style="margin-right: 0; margin-left: 60px"
								>
									<a-table
										size="middle"
										class="h-full overflow-x-auto"
										:data-source="diDataLists"
										:pagination="{ pageSize: 5 }"
										:scroll="{ x: 1900 }"
										bordered
										:rowKey="(record) => record.Id"
										style="
											margin-left: -10px;
											margin-top: 10px;
										"
										:row-selection="{
											selectedRowKeys: selectedRowKeys,
											onChange: onSelectChange,
											onSelectAll: onSelectAll,
										}"
										@change="handleTableChange"
									>
										<!-- 相关DI -->
										<a-table-column
											key="DataAssetsId"
											data-index="DataAssetsId"
											width="100px"
										>
											<span slot="title">{{
												$t(
													'user.verification-code.required111566110577136'
												)
											}}</span>
											<template slot-scope="text, record">
												<a @click="showModel(record)">
													{{ record.DataAssetsId }}
												</a>
												<!-- <a-button type="link" @click="delde(record)">{{ $t('app.setting.copy') }}</a-button> -->
											</template>
										</a-table-column>
										<!--数据字段 -->
										<a-table-column
											key="DataItemStr"
											width="310px"
										>
											<template #title>
												<div class="title-content">
													{{
														$t(
															'app.setting.themecolor.dust'
														)
													}}
													<p class="little-tag">
														{{
															$t(
																'app.setting.themecolor.dusttip.be'
															)
														}}
														<span
															class="blue-content"
															>China-DG@enterprise.com</span
														>
														{{
															$t(
																'app.setting.themecolor.dusttip.af'
															)
														}}
													</p>
												</div>
											</template>
											<template slot-scope="text, record">
												<span>
													<!-- 数据字段 -->
													<div>
														<a-select
															:placeholder="
																$t(
																	'app.setting.themecolor.dust.select'
																)
															"
															v-model="
																record.DataItemsStr
															"
															show-search
															:show-arrow="false"
															:filter-option="
																false
															"
															@focus="
																filterSearchInputOption
															"
															@search="
																filterSearchInputOption
															"
															:disabled="disabled"
															@change="
																handleDiChange
															"
															v-if="
																$t(
																	'app.setting.themecolor.dust'
																) == '数据字段'
															"
															:dropdownMatchSelectWidth="
																false
															"
															:dropdownStyle="{
																width: '580px',
															}"
															popupClassName="select-drop-down-platform"
														>
															<a-select-option
																v-for="item in dataItemsSearchData"
																:value="
																	item.value
																"
																:key="
																	item.label +
																	item.value
																"
															>
																<a-tooltip
																	placement="topLeft"
																>
																	<template
																		slot="title"
																	>
																		{{
																			item.label
																		}}
																	</template>
																	<span
																		class="long-text"
																		>{{
																			item.label
																		}}</span
																	>
																</a-tooltip>
															</a-select-option>
														</a-select>
														<a-select
															:placeholder="
																$t(
																	'app.setting.themecolor.dust.select'
																)
															"
															v-model="
																record.DataItemsStr
															"
															show-search
															:show-arrow="false"
															:filter-option="
																false
															"
															@focus="
																filterSearchInputOptionEn
															"
															@search="
																filterSearchInputOptionEn
															"
															@change="
																handleDiChange
															"
															style="
																max-width: 400px;
																min-width: 150px;
															"
															:disabled="disabled"
															v-else
															:dropdownMatchSelectWidth="
																false
															"
															:dropdownStyle="{
																width: '580px',
															}"
														>
															<a-select-option
																v-for="item in dataItemsSearchData"
																:value="
																	item.value
																"
																:key="
																	item.value +
																	item.labelEn
																"
															>
																<a-tooltip
																	placement="topLeft"
																>
																	<template
																		slot="title"
																	>
																		{{
																			lang ===
																			'zh-CN'
																				? item.label
																				: item.labelEn ||
																				  item.label
																		}}
																	</template>
																	{{
																		lang ===
																		'zh-CN'
																			? item.label
																			: item.labelEn ||
																			  item.label
																	}}
																</a-tooltip>
															</a-select-option>
														</a-select>
													</div>
												</span>
											</template>
										</a-table-column>
										<!-- 数据级别 -->
										<a-table-column
											key="DataLevelStr"
											data-index="DataLevelStr"
											width="90px"
										>
											<span slot="title">{{
												$t(
													'user.verification-code.required111566110577137'
												)
											}}</span>
										</a-table-column>
										<!-- // 数据敏感度 -->
										<a-table-column
											key="DataSensitivityStr"
											data-index="DataSensitivityStr"
											width="180px"
										>
											<span slot="title">{{
												$t(
													'user.verification-code.required111566110577138'
												)
											}}</span>
										</a-table-column>
										<a-table-column
											key="DetailNecessity"
											:title="
												$t(
													'user.verification-code.required1115661105771399999'
												)
											"
											width="200px"
										>
											<template slot-scope="text, record">
												<span>
													<!-- 数据处理必要性 -->
													<a-input
														v-model="
															record.DetailNecessity
														"
														:placeholder="
															$t(
																'user.verification-code.required111566110577139'
															)
														"
														:disabled="disabled"
													/>
												</span>
											</template>
										</a-table-column>
										<a-table-column
											key="DataCity"
											:title="
												$t(
													'user.verification-code.required1199'
												)
											"
											width="160px"
										>
											<template slot-scope="text, record">
												<span>
													<!-- 城市 -->
													<div>
														<a-select
															v-model="
																record.DataCity
															"
															:placeholder="
																$t(
																	'user.verification-code.required1199'
																)
															"
															style="
																max-width: 300px;
																min-width: 120px;
															"
															:disabled="disabled"
															mode="multiple"
															option-filter-prop="children"
														>
															<a-select-option
																v-for="item in sonfigurationItemsContent"
																:value="
																	item.value
																"
																:key="
																	item.label +
																	item.value
																"
															>
																{{ item.label }}
															</a-select-option>
														</a-select>
													</div>
												</span>
											</template>
										</a-table-column>
										<!-- 数据存放地点 -->
										<a-table-column	key="DataDeposit" :title="$t('user.verification-code.required1115661105771400000')" width="230px">
											<template slot-scope="text, record">
												<span>
													<!-- 数据存放地点 -->
													<a-select
														v-model=" record.DataDeposit "
														option-filter-prop="children"
														:placeholder=" $t( 'user.verification-code.required1115661105771400000' ) "
														style=" max-width: 300px; min-width: 140px; "
														:disabled="disabled" mode="multiple" :filter-option="false"
														@search="positionSearch"
														:dropdownMatchSelectWidth=" false " >
														<a-select-option
															v-for="item in fonfigurationItemsContent"
															:value="item.value"
															:key=" item.label + 	item.value " 	>
															<a-tooltip placement="topLeft" 	>
																<template slot="title" > {{ item.label }} 	</template>
																<span class="long-text"	>{{item.label}}</span>
															</a-tooltip>
														</a-select-option>
													</a-select>
												</span>
											</template>
										</a-table-column>
										<!-- 来源 -->
										<a-table-column
											key="DataSource"
											:title="
												$t('user.register-result.msg')
											"
											width="250px"
										>
											<template slot-scope="text, record">
												<span>
													<div class="conter">
														<a-select
															v-model="
																record.DataSource
															"
															:placeholder="
																$t(
																	'user.register-result.msg'
																)
															"
															option-filter-prop="children"
															:filter-option="
																false
															"
															style="
																max-width: 800px;
																min-width: 200px;
															"
															mode="multiple"
															:disabled="disabled"
															@search="fetchUser"
															@focus="fetchUser"
															:dropdownMatchSelectWidth="
																false
															"
															:dropdownStyle="{
																width: '380px',
															}"
															@popupScroll="
																appendData
															"
														>
															<template
																slot="notFoundContent"
															>
																<center>
																	<a-button
																		type="dashed"
																		@click="
																			onChange1(
																				record,
																				'DataSource'
																			)
																		"
																		v-if="
																			!appidLists.length
																		"
																		>{{
																			$t(
																				'rpa.form.AddApplication'
																			)
																		}}
																	</a-button>
																</center>
															</template>
															<a-select-option
																v-for="(
																	item, ind
																) in appidLists"
																:value="
																	item.value
																"
																:key="
																	ind +
																	item.value
																"
															>
																<a-tooltip
																	placement="topLeft"
																>
																	<template
																		slot="title"
																	>
																		{{
																			item.label
																		}}
																	</template>
																	<span
																		class="long-text"
																		>{{
																			item.label
																		}}</span
																	>
																</a-tooltip>
															</a-select-option>
														</a-select>
													</div>
												</span>
											</template>
										</a-table-column>
										<!-- 目的地 -->
										<a-table-column
											key="DataDestination"
											:title="
												$t(
													'user.register-result.activation-email'
												)
											"
										>
											<template slot-scope="text, record">
												<span>
													<div class="conter">
														<a-select
															mode="multiple"
															v-model="
																record.DataDestination
															"
															@search="fetchUser"
															@focus="fetchUser"
															:disabled="disabled"
															option-filter-prop="children"
															:placeholder="
																$t(
																	'user.register-result.activation-email'
																)
															"
															style="
																max-width: 800px;
																min-width: 200px;
															"
															:filter-option="
																false
															"
															:dropdownMatchSelectWidth="
																false
															"
															:dropdownStyle="{
																width: '380px',
															}"
															@popupScroll="
																appendData
															"
														>
															<template
																slot="notFoundContent"
															>
																<center>
																	<a-button
																		type="dashed"
																		@click="
																			onChange1(
																				record,
																				'DataDestination'
																			)
																		"
																		v-if="
																			!appidLists.length
																		"
																		>{{
																			$t(
																				'rpa.form.AddApplication'
																			)
																		}}
																	</a-button>
																</center>
															</template>
															<a-select-option
																v-for="item in appidLists"
																:value="
																	item.value
																"
																:key="
																	item.label +
																	item.value
																"
															>
																<a-tooltip
																	placement="topLeft"
																>
																	<template
																		slot="title"
																	>
																		{{
																			item.label
																		}}
																	</template>
																	<span
																		class="long-text"
																		>{{
																			item.label
																		}}</span
																	>
																</a-tooltip>
															</a-select-option>
														</a-select>
													</div>
												</span>
											</template>
										</a-table-column>
										<!--  操作 -->
										<a-table-column
											key="action"
											:title="
												$t('app.setting.othersettings')
											"
											v-if="!disabled"
											width="75px"
										>
											<template slot-scope="text, record">
												<span>
													<!-- 删除 -->
													<a-popconfirm
														:title="
															$t(
																'user.verification-code.required111566110577225'
															)
														"
														:ok-text="
															$t(
																'user.verification-code.required1166'
															)
														"
														:cancel-text="
															$t(
																'user.email.required11'
															)
														"
														@confirm="
															() =>
																delxiangqing(
																	record,
																	state
																)
														"
														v-if="!disabled"
													>
														<a-button
															type="link"
															size="small"
															>{{
																$t(
																	'menu.exception.trigger'
																)
															}}</a-button
														>
													</a-popconfirm>
												</span>
											</template>
										</a-table-column>
									</a-table>
									<a-modal
										v-model="batchVisible"
										width="600px"
									>
										<a-space>
											<div class="ty"></div>
											{{ $t('user.editcontent') }}
										</a-space>
										<a-form
											:form="batchUpForm"
											:label-col="{ span: 14 }"
											:wrapper-col="{ span: 10 }"
											layout="horizontal"
											labelAlign="left"
										>
											<a-checkbox-group
												@change="onChange"
												v-model="checkedValues"
											>
												<div class="flex-row">
													<a-checkbox
														value="DetailNecessity"
													></a-checkbox>
													<a-form-item
														:label="
															$t(
																'user.verification-code.required1115661105771399999'
															)
														"
													>
														<a-input
															v-decorator="[
																'DetailNecessity',
															]"
															:placeholder="
																$t(
																	'user.verification-code.required111566110577139'
																)
															"
															@change="
																onChange(
																	checkedValues
																)
															"
														></a-input>
													</a-form-item>
												</div>
												<div class="flex-row">
													<a-checkbox
														value="DataCity"
													></a-checkbox>
													<a-form-item
														:label="
															$t(
																'user.verification-code.required1199'
															)
														"
													>
														<a-select
															v-decorator="[
																'DataCity',
															]"
															:placeholder="
																$t(
																	'user.verification-code.required1199'
																)
															"
															mode="multiple"
															option-filter-prop="children"
															@change="
																onChange(
																	checkedValues
																)
															"
														>
															<a-select-option
																v-for="item in sonfigurationItemsContent"
																:value="
																	item.value
																"
																:key="
																	item.label +
																	item.value
																"
															>
																{{ item.label }}
															</a-select-option>
														</a-select>
													</a-form-item>
												</div>
												<div class="flex-row">
													<a-checkbox
														value="DataDeposit"
													></a-checkbox>
													<a-form-item
														:label="
															$t(
																'user.verification-code.required1115661105771400000'
															)
														"
													>
														<a-select
															v-decorator="[
																'DataDeposit',
															]"
															:placeholder="
																$t(
																	'user.verification-code.required1115661105771400000'
																)
															"
															option-filter-prop="children"
															mode="multiple"
															:filter-option="
																false
															"
															@change="
																onChange(
																	checkedValues
																)
															"
															@search="
																positionSearch
															"
														>
															<a-select-option
																v-for="item in fonfigurationItemsContent"
																:value="
																	item.value
																"
																:key="
																	item.label +
																	item.value
																"
															>
																<a-tooltip
																	placement="topLeft"
																>
																	<template
																		slot="title"
																	>
																		{{
																			item.label
																		}}
																	</template>
																	{{
																		item.label
																	}}
																</a-tooltip>
															</a-select-option>
														</a-select>
													</a-form-item>
												</div>
												<div class="flex-row">
													<a-checkbox
														value="DataSource"
													></a-checkbox>
													<a-form-item
														:label="
															$t(
																'user.register-result.msg'
															)
														"
													>
														<a-select
															:placeholder="
																$t(
																	'user.register-result.msg'
																)
															"
															option-filter-prop="children"
															:filter-option="
																false
															"
															mode="multiple"
															v-decorator="[
																'DataSource',
															]"
															:disabled="disabled"
															@search="fetchUser"
															@focus="fetchUser"
															@change="
																onChange(
																	checkedValues
																)
															"
															:dropdownMatchSelectWidth="
																false
															"
															:dropdownStyle="{
																width: '480px',
															}"
															@popupScroll="
																appendData
															"
														>
															<template
																slot="notFoundContent"
															>
																<center>
																	<a-button
																		type="dashed"
																		@click="
																			onChange1(
																				null,
																				'DataSource'
																			)
																		"
																		v-if="
																			!appidLists.length
																		"
																		>{{
																			$t(
																				'rpa.form.AddApplication'
																			)
																		}}
																	</a-button>
																</center>
															</template>
															<a-select-option
																v-for="(
																	item, ind
																) in appidLists"
																:value="
																	item.value
																"
																:key="
																	ind +
																	item.value
																"
															>
																<a-tooltip
																	placement="topLeft"
																>
																	<template
																		slot="title"
																	>
																		{{
																			item.label
																		}}
																	</template>
																	{{
																		item.label
																	}}
																</a-tooltip>
															</a-select-option>
														</a-select>
													</a-form-item>
												</div>
												<div class="flex-row">
													<a-checkbox
														value="DataDestination"
													></a-checkbox>
													<a-form-item
														:label="
															$t(
																'user.register-result.activation-email'
															)
														"
													>
														<a-select
															mode="multiple"
															:disabled="disabled"
															option-filter-prop="children"
															:placeholder="
																$t(
																	'user.register-result.activation-email'
																)
															"
															:filter-option="
																false
															"
															v-decorator="[
																'DataDestination',
															]"
															@search="fetchUser"
															@focus="fetchUser"
															@change="
																onChange(
																	checkedValues
																)
															"
															:dropdownMatchSelectWidth="
																false
															"
															:dropdownStyle="{
																width: '480px',
															}"
															@popupScroll="
																appendData
															"
														>
															<template
																slot="notFoundContent"
															>
																<center>
																	<a-button
																		type="dashed"
																		@click="
																			onChange1(
																				null,
																				'DataDestination'
																			)
																		"
																		v-if="
																			!appidLists.length
																		"
																		>{{
																			$t(
																				'rpa.form.AddApplication'
																			)
																		}}
																	</a-button>
																</center>
															</template>
															<a-select-option
																v-for="item in appidLists"
																:value="
																	item.value
																"
																:key="
																	item.label +
																	item.value
																"
															>
																<a-tooltip
																	placement="topLeft"
																>
																	<template
																		slot="title"
																	>
																		{{
																			item.label
																		}}
																	</template>
																	{{
																		item.label
																	}}
																</a-tooltip>
															</a-select-option>
														</a-select>
													</a-form-item>
												</div>
											</a-checkbox-group>
										</a-form>
										<div
											class="flex absolute right-0 bottom-0 w-full px-4 py-[10px] bg-white text-left z-1 flex justify-center"
										>
											<a-button
												class="border-none hover:bg-[#3F8CFF] hover:bg-opacity-5 shadow mr-[20px]"
												@click="close"
												>{{
													$t('user.email.required11')
												}}</a-button
											>
											<a-button
												class="border-none shadow"
												type="primary"
												:disabled="
													!checkedValues.length ||
													btnDisabled
												"
												@click="submit"
												>{{
													$t(
														'user.email.required1111'
													)
												}}
											</a-button>
										</div>
									</a-modal>
									<a-row>
										<a-col :span="12">
											<a-row>
												<a-col :span="6">
													<!-- 批量更新按钮 -->
													<a-button
														type="primary"
														class="batchup-btn"
														:disabled="
															!selectedRowKeys.length
														"
														@click="batchup"
														>{{
															$t('user.batchup')
														}}
													</a-button>
												</a-col>
												<a-col :span="6">
													<!-- 从DI导出 -->
													<a-button
														type="link"
														class="import-butoon"
														icon="vertical-align-bottom"
														@click="openModal"
														v-if="!disabled"
														>{{
															$t(
																'user.verification-code.required1144'
															)
														}}
													</a-button>
												</a-col>
												<a-col :span="6">
													<!-- 新增数据字段 -->
													<a-button
														type="link"
														class="import-butoon"
														@click="createDataModal"
														v-if="!disabled"
														>{{
															$t(
																'app.setting.themecolor.gggg'
															)
														}}
													</a-button>
												</a-col>
											</a-row>
										</a-col>
										<a-col :span="6"></a-col>
										<a-col :span="6"></a-col>
									</a-row>
								</a-form-item>
							</a-col>
						</a-row>
						<!--  单选内容-->
						<div class="checkbox">
							<a-form-item>
								<span
									slot="label"
									style="white-space: normal"
									>{{
										$t(
											'user.verification-code.required1133'
										)
									}}</span
								>
								<a-checkbox-group
									:disabled="disabled"
									v-decorator="[
										'RpaActivityCycle',
										{
											rules: [
												{
													required: true,
													message: $t(
														'user.verification-code.required1133346574534263'
													),
												},
											],
										},
									]"
									class="a-checkbox-group"
								>
									<a-checkbox
										:style="radioStyle"
										:value="item.value"
										v-for="(
											item, i
										) in dataProcessingActivityCycleData"
										:key="i"
									>
										{{ item.label }}
										<!-- 提示信息 -->
										<template
											v-if="
												item.annotation ||
												item.annotationEn
											"
										>
											<a-tooltip>
												<template slot="title">
													{{
														item.annotation ||
														item.annotationEn
													}}
												</template>
												<a-icon
													type="question-circle"
												></a-icon>
											</a-tooltip>
										</template>
									</a-checkbox>
								</a-checkbox-group>
							</a-form-item>
							<a-form-item>
								<span slot="label">{{
									$t('user.verification-code.required1155')
								}}</span>
								<a-checkbox-group
									v-decorator="['RpaActivityType']"
									class="a-checkbox-group-1"
									:disabled="disabled"
								>
									<div
										v-for="ind of Math.ceil(
											processingActivityTypesData.length /
												4
										)"
										:key="
											processingActivityTypesData[ind]
												.value + ind
										"
										class="a-checkbox-group"
									>
										<a-checkbox
											:style="radioStyle"
											:value="item.value"
											v-for="(
												item, i
											) in processingActivityTypesData.slice(
												4 * ind - 4,
												4 * ind
											)"
											:key="i"
										>
											{{ item.label }}
											<!-- 提示信息 -->
											<template
												v-if="
													item.annotation ||
													item.annotationEn
												"
											>
												<a-tooltip>
													<template slot="title">
														{{
															item.annotation ||
															item.annotationEn
														}}
													</template>
													<a-icon
														type="question-circle"
													></a-icon>
												</a-tooltip>
											</template>
										</a-checkbox>
									</div>
								</a-checkbox-group>
							</a-form-item>
						</div>
						<div v-if="detailStatus">
							<a-form-item
								:label="
									$t('user.verification-code.required1114')
								"
							>
								<a-input placeholder="XXX" disabled />
							</a-form-item>
							<br />
							<a-form-item
								:label="
									$t('user.verification-code.required1115')
								"
							>
								<a-input
									placeholder="2023/3/10 15:45"
									disabled
								/>
							</a-form-item>
							<br />
							<a-form-item
								:label="
									$t('user.verification-code.required111566')
								"
							>
								<a-input
									placeholder="2023/3/10 15:45"
									disabled
								/>
							</a-form-item>
							<br />
						</div>
						<div
							class="line"
							v-if="$route.query.state !== 'add'"
						></div>
						<a-descriptions
							:column="1"
							v-if="$route.query.state !== 'add'"
						>
							<a-descriptions-item
								:label="
									$t(
										'user.verification-code.required1115661105793'
									)
								"
								>{{
									rpaInfo.RpaCreatePeopleStr
								}}</a-descriptions-item
							>
							<a-descriptions-item
								:label="
									$t(
										'user.verification-code.required111566131'
									)
								"
								>{{
									rpaInfo.RpaCreatetime
								}}</a-descriptions-item
							>
							<a-descriptions-item
								:label="
									$t(
										'user.verification-code.required1115661105752'
									)
								"
								>{{
									rpaInfo.RpaUpdatetime
								}}</a-descriptions-item
							>
						</a-descriptions>
					</div>
				</div>
				<a-row v-if="initFromData.RpaIfCompletedPIA == 1">
					<a-col :span="12">
						<!-- 私隐影响评估描述 -->
						<a-form-item
							:label="$t('user.verification-code.requiredLuck12')"
						>
							<a-textarea
								v-decorator="[
									'RpaPIALinkUrl',
									{
										rules: [
											{
												required: true,
												message: $t(
													'user.verification-code.requiredLuck14'
												),
											},
										],
									},
								]"
								:auto-size="{ minRows: 3, maxRows: 7 }"
								style="width: 490px"
								:placeholder="
									$t('user.verification-code.requiredLuck13')
								"
								:disabled="disabled"
							/>
						</a-form-item>
					</a-col>
				</a-row>
			</a-form>
			<div
				:style="{
					position: 'absolute',
					right: 0,
					bottom: 0,
					width: '100%',
					borderTop: '1px solid #e9e9e9',
					padding: '10px 16px',
					background: '#fff',
					textAlign: 'center',
					zIndex: 1,
				}"
			>
				<!-- 提交 -->
				<a-button
					v-if="!disabled"
					type="primary"
					@click="warning(1)"
					style="margin-right: 20px"
					>{{ $t('user.verification-code.required11668888') }}
				</a-button>
				<!-- 保存草稿 -->
				<a-button
					v-if="!disabled"
					@click="warning(0)"
					style="margin-right: 20px"
					>{{ $t('user.register-result.view-mailbox') }}
				</a-button>
				<!-- 返回 -->
				<a-button style="margin-right: 8px" @click="cancellation"
					>{{ $t('user.email.required11') }}
				</a-button>
			</div>
		</a-card>

		<!-- 从DI导入 -->
		<a-modal
			:visible="visible"
			@ok="handleDiSubmit"
			@cancel="handleDiCancel"
			width="800px"
			:ok-text="$t('user.verification-code.required1166')"
			:cancel-text="$t('user.email.required11')"
		>
			<a-form layout="inline">
				<a-form-item :label="$t('user.verification-code.required1177')">
					<a-select
						show-search
						option-filter-prop="children"
						v-model="handleChangeAssetsSelect"
						@change="handleChangeAssets"
						:placeholder="$t('user.verification-code.required1188')"
						style="width: 220px"
					>
						<a-select-option
							v-for="items in rpaSelectAssetNameData"
							:value="items.value"
							:key="items.label + items.value"
							>{{ items.label }}
						</a-select-option>
					</a-select>
				</a-form-item>
			</a-form>

			<a-table
				size="middle"
				class="h-full table-di overflow-x-auto"
				:pagination="false"
				:data-source="rpaDidataLists"
				bordered
				:row-selection="rowSelection"
				:rowKey="(record) => record.Id"
			>
				<a-table-column
					key="DataItemsStr"
					:data-index="
						lang === 'zh-CN' ? 'DataItemsStr' : 'DataItemsStrEn'
					"
					width="50px"
					disabled
				>
					<span slot="title">{{
						$t('app.setting.themecolor.dust')
					}}</span>
				</a-table-column>
				<!-- // 数据所在城市 -->
				<a-table-column
					key="DataCity"
					data-index="DataCity"
					width="150px"
					:allowClear="false"
					:noFoundContent="noFoundContentText"
				>
					<span slot="title">{{
						$t('user.register.get-verification-code')
					}}</span>
					<template slot-scope="text, record">
						<a-select
							mode="multiple"
							v-model="record.DataCity"
							disabled
							:placeholder="
								$t(
									'user.verification-code.required111566110577338'
								)
							"
							style="width: 128px"
						>
							<a-select-option
								v-for="item in sonfigurationItemsContent"
								:value="item.value"
								:key="item.label + item.value"
							>
								{{ item.label }}
							</a-select-option>
						</a-select>
					</template>
				</a-table-column>
				<!-- 数据存放地点 -->
				<a-table-column
					key="DataDeposit"
					:title="
						$t('user.verification-code.required111566110577140')
					"
				>
					<template slot-scope="text, record">
						<span>
							<!-- 数据存放地点 -->
							<a-select
								v-model="record.DataDeposit"
								disabled
								width="150px"
								:placeholder="
									$t(
										'user.verification-code.required111566110577140'
									)
								"
								style="max-width: 300px; min-width: 140px"
								mode="multiple"
								dropdownMenuStyle="{ width: '500px' }"
							>
								<a-select-option
									v-for="item in fonfigurationItemsContent"
									:value="item.value"
									:key="item.label + item.value"
								>
									{{ item.label }}
								</a-select-option>
							</a-select>
						</span>
					</template>
				</a-table-column>
				<!-- 数据来源 -->
				<a-table-column
					key="DataSource"
					:title="$t('user.register-result.msg')"
				>
					<template slot-scope="text, record">
						<span>
							<div>
								<a-select
									v-model="record.DataSource"
									:placeholder="
										$t('user.register-result.msg')
									"
									width="150px"
									@search="fetchUser"
									disabled
									mode="multiple"
								>
									<a-select-option
										v-for="item in appidLists"
										:value="item.value"
										:key="item.label + item.value"
									>
										{{ item.label }}
									</a-select-option>
								</a-select>
							</div>
						</span>
					</template>
				</a-table-column>
				<!-- 目的地 -->
				<a-table-column
					key="DataDestination"
					:title="$t('user.register-result.activation-email')"
				>
					<template slot-scope="text, record">
						<span>
							<div>
								<a-select
									v-model="record.DataDestination"
									:placeholder="
										$t(
											'user.register-result.activation-email'
										)
									"
									width="150px"
									@search="fetchUser"
									mode="multiple"
									disabled
								>
									<a-select-option
										v-for="item in appidLists"
										:value="item.value"
										:key="item.label + item.value"
									>
										{{ item.label }}
									</a-select-option>
								</a-select>
							</div>
						</span>
					</template>
				</a-table-column>
			</a-table>
		</a-modal>
		<!-- 新增数据字段 -->
		<!-- 修改按钮 -->
		<a-modal
			:visible="showDataFields"
			@ok="showCreateRpaMiniModel()"
			@cancel="closeDataFields()"
			:okText="$t('app.setting.content-width.fluid2222')"
			:cancelText="$t('app.setting.content-width.fluid2222333')"
		>
			<a-space>
				<div class="tags"></div>
				{{
					$t('user.verification-code.required1115661105773714422814')
				}}
			</a-space>
			<a-form layout="inline" class="mt-[15px]">
				<a-radio-group v-model="radioValue" @change="radioChange">
					<a-radio :style="radioStyle" :value="1" v-if="modestate">
						{{
							$t(
								'user.verification-code.required111566110577371442281423'
							)
						}}
					</a-radio>
					<a-radio :style="radioStyle" :value="2">
						{{
							$t(
								'user.verification-code.required111566110577371442281424'
							)
						}}
					</a-radio>
				</a-radio-group>
				<a-form-item>
					<a-select
						:placeholder="$t('user.verification-code.required1113')"
						v-model="diId"
						style="width: 220px"
						@change="changegai"
						v-if="modestate"
					>
						<a-select-option
							v-for="items in diList"
							:value="items.value"
							:key="items.label + items.value"
							>{{ items.label }}
						</a-select-option>
					</a-select>
				</a-form-item>
			</a-form>
		</a-modal>
		<!-- 确认，选择DPIA，创建问卷submitCreate-->
		<a-modal
			:visible="createQuestionStatus"
			@ok="handleCreateQuestionSubmit"
			@cancel="handleCreateQuestionCancel"
			:ok-text="$t('user.verification-code.required1166')"
			:cancel-text="$t('user.email.required11')"
			width="400px"
			:confirmLoading="confirmLoading"
		>
			<a-space>
				<div class="tags"></div>
				{{ $t('user.verification-code.required1100') }}
			</a-space>
			<a-form layout="inline" class="mt-[15px]" :form="form1">
				<!-- 关联的RPA名称 -->
				<a-form-item
					:label="$t('user.verification-code.required11156611027')"
				>
					<a-input
						:placeholder="
							$t('user.verification-code.required1115661102711')
						"
						style="
							width: 300px;
							margin-right: 30px;
							margin-left: 13px;
						"
						disabled
						v-decorator="[
							'DpiaRpaId',
							{
								rules: [
									{
										required: true,
										message: $t(
											'user.verification-code.required111566110577315'
										),
									},
								],
							},
						]"
					></a-input>
				</a-form-item>
				<!-- DPIA模板 -->
				<a-form-item
					:label="$t('user.verification-code.required11156611028')"
				>
					<a-select
						:placeholder="
							$t('user.verification-code.required1115661102811')
						"
						:disabled="!pia"
						style="
							width: 309px;
							margin-right: 30px;
							margin-left: 5px;
						"
						class="pl-[8px]"
						option-filter-prop="children"
						:filter-option="filterOption"
						show-search
						v-decorator="[
							'DpiaModelId',
							{
								rules: [
									{
										required: pia,
										message: $t(
											'user.verification-code.required111566110577316'
										),
									},
								],
							},
						]"
					>
						<a-select-option
							v-for="items in dpiaSelectListsData"
							:value="items.value"
							:disabled="
								items.value == 1000 || items.value == 1001
							"
							:key="items.label + items.value"
							>{{ items.label }}
						</a-select-option>
					</a-select>
				</a-form-item>
				<!-- DPIA的名称 -->
				<a-form-item
					:label="$t('menu.account.logout1122992277994544543265')"
				>
					<a-input
						v-decorator="[
							'DpiaName',
							{
								rules: [
									{
										required: true,
										message: $t(
											'menu.account.logout1122992277994544543265444'
										),
									},
								],
							},
						]"
						:placeholder="
							$t('menu.account.logout1122992277994544543265444')
						"
						style="
							width: 300px;
							margin-right: 30px;
							margin-left: 13px;
						"
					></a-input>
				</a-form-item>
			</a-form>
		</a-modal>

		<!-- 禁止退出当前页面弹窗，点击下方三个任意按钮后可以离开 -->
		<a-modal
			v-model="ifvisible"
			:title="$t('app.setting.themecolor.rr100')"
			on-ok="handleOk"
		>
			<template slot="footer">
				<span></span>
			</template>
			<div class="dlex">
				<a-button type="primary" @click="rollback">
					{{ $t('app.setting.themecolor.rr101') }}
				</a-button>
				<a-button type="primary" @click="warning(0)">
					{{ $t('app.setting.themecolor.rr102') }}
				</a-button>
				<a-button @click="ifvisible = false">
					{{ $t('app.setting.themecolor.rr103') }}
				</a-button>
			</div>
		</a-modal>
		<!-- 大抽屉 -->
		<a-drawer
			:title="modalTitle"
			placement="right"
			:closable="false"
			:visible="modalVisible"
			:width="1200"
			:rowKey="(record) => record.Id"
			@close="closeDrawer"
		>
			<a-form
				:form="diForm"
				ref="form"
				class="drawer-form"
				label-align="left"
			>
				<!-- APP名称 -->
				<a-row :gutter="24">
					<a-col :span="8">
						<a-form-item
							:label="
								$t(
									'user.verification-code.required1115661105772124555'
								)
							"
						>
							<a-select
								:placeholder="
									$t(
										'user.verification-code.required1115661105772113464357654435'
									)
								"
								@change="handleChangeAppid"
								show-search
								option-filter-prop="children"
								v-decorator="[
									'DataLibraryAppidId',
									{
										rules: [
											{
												required: true,
												message: $t(
													'user.verification-code.required111566110577280'
												),
											},
										],
									},
								]"
								disabled
							>
								<a-select-option
									v-for="item in appidLists"
									:value="item.value"
									:key="item.value"
								>
									{{ item.label }}
								</a-select-option>
							</a-select>
						</a-form-item>
					</a-col>
					<a-col :span="8">
						<!-- APP负责人 -->
						<a-form-item
							:label="
								$t(
									'user.login.mobile.verification-code.placeholder'
								)
							"
						>
							<a-input
								v-decorator="['AppidMaster']"
								:placeholder="
									$t(
										'user.login.mobile.verification-code.placeholder11'
									)
								"
								disabled
							/>
						</a-form-item>
					</a-col>
					<a-col :span="8">
						<a-form-item
							:label="$t('user.login.password.placeholder')"
						>
							<a-input
								v-decorator="['AppidDepartMent']"
								:placeholder="
									$t('user.login.message-invalid-credentials')
								"
								disabled
							/>
						</a-form-item>
					</a-col>
				</a-row>
				<a-row :gutter="24">
					<a-col :span="8">
						<a-form-item label="enterprise APP ID">
							<a-input
								v-decorator="['BmwAppId']"
								placeholder="enterprise APP ID"
								disabled
							/>
						</a-form-item>
					</a-col>
					<a-col :span="8">
						<a-form-item label="企业 APP ID">
							<a-input
								v-decorator="['BbaAppId']"
								placeholder="企业 APP ID"
								disabled
							/>
						</a-form-item>
					</a-col>
					<a-col :span="8">
						<a-form-item label="Feature ID">
							<a-input
								v-decorator="['FeatherId']"
								placeholder="Feature ID"
								disabled
							/>
						</a-form-item>
					</a-col>
				</a-row>
				<a-row :gutter="24">
					<a-col :span="8">
						<a-form-item
							:label="
								$t(
									'user.verification-code.required1115661105771411111'
								)
							"
						>
							<a-input
								v-decorator="['DataLibraryUser']"
								disabled
							/>
						</a-form-item>
					</a-col>
					<a-col :span="8">
						<a-form-item
							:label="
								$t(
									'user.verification-code.required111566110577142'
								)
							"
						>
							<a-input
								v-decorator="['DataLibraryCreateTime']"
								disabled
							/>
						</a-form-item>
					</a-col>
					<a-col :span="8">
						<a-form-item
							:label="
								$t(
									'user.verification-code.required111566110577143'
								)
							"
						>
							<a-input
								v-decorator="['DataLibraryUpdateTime']"
								disabled
							/>
						</a-form-item>
					</a-col>
				</a-row>
				<a-row :gutter="24">
					<a-col :span="8">
						<!-- 数据控制者 -->
						<a-form-item :label="$t('user.login.remember-me')">
							<a-select
								mode="multiple"
								@change="changeselect"
								option-filter-prop="children"
								v-decorator="[
									'DataLibraryController',
									{
										rules: [
											{
												required: true,
												message: $t(
													'user.login.forgot-password'
												),
											},
										],
									},
								]"
								:placeholder="$t('user.login.forgot-password')"
								disabled
							>
								<a-select-option
									v-for="item in systemControllerSourceData"
									:value="item.value"
									:key="item.value"
									>{{ item.label }}
								</a-select-option>
							</a-select>
						</a-form-item>
					</a-col>
					<a-col :span="8" v-if="otherflag">
						<a-form-item label="Other">
							<a-input
								v-decorator="[
									'DataLibraryControllerOther',
									{
										rules: [
											{
												required: true,
												message: $t(
													'user.verification-code.required111566110577336'
												),
											},
										],
									},
								]"
								disabled
							/>
						</a-form-item>
					</a-col>
					<a-col :span="8">
						<!-- 线上/线下 -->
						<a-form-item
							:label="$t('user.login.tab-login-credentials')"
						>
							<a-select
								v-decorator="[
									'DataLibraryEnvironment',
									{
										rules: [
											{
												required: true,
												message: $t(
													'user.verification-code.required1115661105773368800'
												),
											},
										],
									},
								]"
								show-search
								option-filter-prop="children"
								:filter-option="filterOption"
								:placeholder="$t('user.login.tab-login-mobile')"
								disabled
							>
								<a-select-option
									v-for="item in Xians"
									:value="item.value"
									:key="item.value"
								>
									{{
										lang === 'zh-CN'
											? item.label
											: item.labelEn
									}}
								</a-select-option>
							</a-select>
						</a-form-item>
					</a-col>
				</a-row>
				<a-form-item label="ID" v-show="false" class="hidden">
					<a-input v-decorator="['Id']" disabled />
				</a-form-item>
				<!-- 数据详情 -->
				<a-form-item style="margin-right: 0">
					<div style="position: relative">
						<div
							style="
								color: rgb(0, 255, 76);
								margin-top: -10px;
								display: inline-block;
								top: 9px;
								z-index: 99;
							"
						>
							*
						</div>
						{{ $t('user.register.email.placeholder') }}
					</div>
					<template>
						<a-table
							size="middle"
							:data-source="dataDetailInfoTables"
							:pagination="{ pageSize: 10 }"
							:rowKey="(record) => record.key"
						>
							<!-- 数据字段 -->
							<a-table-column
								key="DataItem"
								data-index="DataItem"
								width="150"
							>
								<span slot="title">{{
									$t('app.setting.themecolor.dust')
								}}</span>
								<!-- 表格右下角操作 -->
								<template slot-scope="text, record">
									<!-- 数据项 -->
									<div v-if="'RpaType' in record">
										<a-select
											:placeholder="
												$t(
													'app.setting.themecolor.dust'
												)
											"
											v-model="record.DataItemStr"
											:show-arrow="false"
											show-search
											@change="handleDiChange"
											@search="handleSearch"
											option-filter-prop="children"
											:filter-option="false"
											style="
												max-width: 280px;
												min-width: 140px;
											"
											v-if="
												$t(
													'app.setting.themecolor.dust'
												) == '数据字段'
											"
										>
											<a-select-option
												v-for="item in dataItemsSearchData"
												:value="item.value"
												:key="item.value"
											>
												<a-tooltip placement="topLeft">
													<template slot="title">
														{{ item.label }}
													</template>
													{{ item.label }}
												</a-tooltip>
											</a-select-option>
										</a-select>
										<a-select
											:placeholder="
												$t(
													'app.setting.themecolor.dust'
												)
											"
											v-model="record.DataItemStr"
											:show-arrow="false"
											show-search
											@change="handleDiChange"
											@search="filterSearchInputOptionEn"
											option-filter-prop="children"
											:filter-option="false"
											style="
												max-width: 280px;
												min-width: 140px;
											"
											v-else
										>
											<a-select-option
												v-for="item in dataItemsSearchData"
												:value="item.value"
												:key="item.value"
											>
												<a-tooltip placement="topLeft">
													<template slot="title">
														{{ item.labelEn }}
													</template>
													{{ item.labelEn }}
												</a-tooltip>
											</a-select-option>
										</a-select>
									</div>
									<span v-else>
										{{
											record[
												lang === 'zh-CN'
													? 'DataItemsStr'
													: 'DataItemsStrEn'
											]
										}}
									</span>
								</template>
							</a-table-column>
							<!-- 数据级别 -->
							<a-table-column
								key="DataLevelStr"
								data-index="DataLevelStr"
								width="50px"
							>
								<span slot="title">{{
									$t('app.setting.themecolor.sunset')
								}}</span>
							</a-table-column>
							<!-- 数据敏感度 -->
							<a-table-column
								key="DataSensitiveStr"
								data-index="DataSensitiveStr"
							>
								<span slot="title">{{
									$t('app.setting.themecolor.green')
								}}</span>
							</a-table-column>
							<!-- 所在城市 -->
							<a-table-column
								key="DataCity"
								data-index="DataCity"
								width="150"
								:allowClear="false"
								:noFoundContent="noFoundContentText"
							>
								<span slot="title">{{
									$t(
										'user.register.get-verification-codeeeee'
									)
								}}</span>
								<template slot-scope="text, record">
									<a-select
										mode="multiple"
										v-model="record.DataCity"
										option-filter-prop="children"
										:placeholder="
											$t(
												'user.verification-code.required111566110577338'
											)
										"
										style="width: 128px"
										disabled
									>
										<a-select-option
											v-for="item in sonfigurationItemsContent"
											:value="item.value"
											:key="item.value"
										>
											{{ item.label }}
										</a-select-option>
									</a-select>
								</template>
							</a-table-column>
							<!-- 数据存储地点 -->
							<a-table-column
								key="DataDeposit"
								data-index="DataDeposit"
								width="150"
							>
								<span slot="title">{{
									$t('user.register.sign-innnnn')
								}}</span>
								<template slot-scope="text, record">
									<a-select
										mode="multiple"
										v-model="record.DataDeposit"
										option-filter-prop="children"
										:placeholder="
											$t(
												'user.verification-code.required111566110577339'
											)
										"
										style="width: 128px"
										disabled
									>
										<a-select-option
											v-for="item in fonfigurationItemsContent"
											:value="item.value"
											:key="item.value"
										>
											{{ item.label }}
										</a-select-option>
									</a-select>
								</template>
							</a-table-column>

							<!-- 来源 -->
							<a-table-column
								key="DataSource"
								:title="$t('user.register-result.msg')"
							>
								<template slot-scope="text, record">
									<span>
										<div class="conter">
											<a-select
												v-model="record.DataSource"
												:placeholder="
													$t(
														'user.register-result.msg'
													)
												"
												option-filter-prop="children"
												style="
													max-width: 158px;
													min-width: 140px;
												"
												disabled
												mode="multiple"
												@search="fetchUser"
											>
												<template
													slot="notFoundContent"
												>
													<center>
														<a-button
															type="dashed"
															@click="
																onChange1(
																	record,
																	'DataSource'
																)
															"
															v-if="
																!appidLists.length
															"
															>{{
																$t(
																	'rpa.form.AddApplication'
																)
															}}
														</a-button>
													</center>
												</template>
												<a-select-option
													v-for="item in appidLists"
													:value="item.value"
													:key="item.value"
												>
													{{ item.label }}
												</a-select-option>
											</a-select>
										</div>
									</span>
								</template>
							</a-table-column>
							<!-- 目的地 -->
							<a-table-column
								key="DataDestination"
								:title="
									$t('user.register-result.activation-email')
								"
							>
								<template slot-scope="text, record">
									<span>
										<div class="conter">
											<a-select
												mode="multiple"
												v-model="record.DataDestination"
												disabled
												@search="fetchUser"
												option-filter-prop="children"
												:placeholder="
													$t(
														'user.register-result.activation-email'
													)
												"
												style="
													max-width: 158px;
													min-width: 140px;
												"
											>
												<template
													slot="notFoundContent"
												>
													<center>
														<a-button
															type="dashed"
															@click="
																onChange1(
																	record,
																	'DataDestination'
																)
															"
															v-if="
																!appidLists.length
															"
															>{{
																$t(
																	'rpa.form.AddApplication'
																)
															}}
														</a-button>
													</center>
												</template>
												<a-select-option
													v-for="item in appidLists"
													:value="item.value"
													:key="item.value"
												>
													{{ item.label }}
												</a-select-option>
											</a-select>
										</div>
									</span>
								</template>
							</a-table-column>

							<!-- 身份信息下的删除 -->
							<span slot="cityAction" slot-scope="text, record">
								<a-select
									mode="multiple"
									v-model="record.DataCity"
									:placeholder="
										$t(
											'user.register.get-verification-code'
										)
									"
									style="width: 128px"
									v-decorator="[
										{
											rules: [
												{
													required: true,
													message:
														'Please input your note!',
												},
											],
										},
									]"
								>
									<a-select-option
										v-for="items in sonfigurationItemsContent"
										:value="items.value"
										:key="items.value"
										>{{ items.label }}</a-select-option
									>
								</a-select>
							</span>
							<span
								slot="depositAction"
								slot-scope="text, record"
							>
								<a-select
									v-model="record.DataDeposit"
									:placeholder="$t('user.register.sign-in')"
									style="width: 128px"
								>
									<a-select-option
										v-for="item in fonfigurationItemsContent"
										:value="item.value"
										:key="item.value"
									>
										{{ item.label }}
									</a-select-option>
								</a-select>
							</span>
							<span slot="sourceAction" slot-scope="text, record">
								<a-select
									v-model="record.DataSource"
									:placeholder="
										$t('user.register-result.msg')
									"
									style="width: 128px"
								>
									<a-select-option
										v-for="item in appidLists"
										:value="item.value"
										:key="item.value"
									>
										{{ item.label }}
									</a-select-option>
								</a-select>
							</span>
							<span
								slot="destinationAction"
								slot-scope="text, record"
							>
								<a-select
									v-model="record.DataDestination"
									:placeholder="
										$t(
											'user.register-result.activation-email'
										)
									"
									style="width: 128px"
								>
									<a-select-option
										v-for="item in appidLists"
										:value="item.value"
										:key="item.value"
									>
										{{ item.label }}
									</a-select-option>
								</a-select>
							</span>
						</a-table>
						<!-- 发现导入 -->
						<a-button
							type="link"
							icon="vertical-align-bottom"
							@click="openModal"
							disabled
							>{{ $t('user.register-result.msg6868') }}
						</a-button>
						<!-- 新增字段 -->
						<a-button type="link" disabled
							>{{ $t('app.setting.themecolor.gggg') }}
						</a-button>
					</template>
				</a-form-item>
			</a-form>
			<div
				:style="{
					position: 'absolute',
					right: 0,
					bottom: 0,
					width: '100%',
					borderTop: '1px solid #e9e9e9',
					padding: '10px 16px',
					background: '#fff',
					textAlign: 'center',
					zIndex: 1,
				}"
			>
				<a-button style="margin-right: 8px" @click="closeDrawer">{{
					$t('user.email.required11')
				}}</a-button>
			</div>
		</a-drawer>
		<Addapp ref="addappid" @child-event="getChildValue"></Addapp>
		<div class="big-box" v-if="ifLoading">
			<a-spin />
		</div>
	</div>
</template>
<script>
import { message } from 'ant-design-vue'
import { configurationSelect } from '@/api/configs'
import {
	dpiaSelectLists,
	rpaDelDetail,
	rpaDetail,
	rpaDiDetail,
	rpaSelectLists,
	rpaFileDelete,
} from '@/api/rpa/form'
import { appIdCreatexl, appIdDetail } from '@/api/appid'
import { rpaCreate } from '@/api/rpa/json'
import {
	rpaDelcsai,
	rpaSelectAssetName,
	configurationItemsFind,
} from '@/api/ytdg'
import { dataLibraryDetail } from '@/api/di/form'
// import Newdpia from './components/newdpia'
import { dpiaQuestionsCreate } from '@/api/dpia/form'
import { VolumeData } from '@/utils/util'
import { childataItems, dccDataItemsSelect } from '@/api/dcc'
import { getUserList } from '@/api/common/form'
import axios from 'axios'
import storage from 'store'
import { ACCESS_TOKEN } from '@/store/mutation-types'
import Addapp from '@/components/componentLibrary/addapp.vue'
import deepClone from 'lodash.clonedeep'
import { getSourceData } from '@/views/rpa/common/dataSource'
import {
	RpaCollectionChannelsList,
	RpaNumberList,
	RpaProcessingActivityCycleList,
	RpaSensitiveNumberList,
	RpaSystemNetworkList,
} from '@/views/rpa/datas/rpaForm'
export default {
	name: 'detail',
	components: {
		Addapp,
	},
	data() {
		return {
			confirmLoading: false,
			keyword: '',
			timerId: '',
			// 新增选中
			radioValueCheck: false,
			// 新增RPA DPIA弹窗
			createRDPIA: true,
			// 创建DPIA问卷状态
			createQuestionStatus: false,
			dpiaId: undefined,
			rpaId: '',
			DpiaRpaId: '',
			// 默认不传ID
			types: false,
			selinput: '',
			// 配置
			config: {
				rules: [
					{
						required: true,
						message: this.$t('user.verification-code.required1113'), //请选择DPIA模板
					},
				],
			},
			inpute: '',
			// 下面这些都是通用的
			form: this.$form.createForm(this),
			rowSelection: {
				onChange: (selectedRowKeys, selectedRows) => {
					this.selectedRows = selectedRows
					console.log('this.selectedRows', this.selectedRows)
				},
			},
			handleDiSubmitStatus: false,
			// DI导入列表
			diDataLists: [],
			// 固定的下拉数据(数据存放地点)
			fonfigurationItemsContent: [],
			sonfigurationItemsContent: [],
			dataItemsSearchData: [],
			appidLists: [],
			dpiaSelectListsData: [],
			// 标题
			pageTitle: '',
			selectedRows: [],
			fileList: [],
			checkBoxValue1: [],
			plainOptions1: [],
			checkBoxValue: [],
			plainOptions: [],
			//新增数据字段的下拉
			arr11: [],
			pagination: {
				page: 1,
				pageSize: 10,
				total: 0,
			},
			userList: [],
			form1: this.$form.createForm(this),
			diForm: this.$form.createForm(this),
			modalVisible: false,
			noFoundContentText: '请选择城市',
			// 数据详情
			dataDetailInfoTables: [],
			modalTitle: '',
			rpaidd: '',
			rpaDidataLists: [],
			visible: false,
			//表格Loading
			listLoading: false,
			loading: false,
			orderInfo: {},
			drugList: [],
			trackList: [],
			systemTimeline: [],
			//di下拉
			diList: [],
			botTimeline: [],
			trackKey: '',
			zhshi: false,
			rpaListData: [],
			disabled1: false,
			// 原始数据
			systemControllerSourceData: [],
			collectionChannelsSourceData: [],
			dataProcessingActivityCycleData: [],
			processingActivityTypesData: [],
			rpaSelectAssetNameData: [],
			dataSubjectData: VolumeData,
			detailStatus: false,
			buttonState: '',
			flagstate: 0,
			handleChangeAssetsSelect: undefined,
			//处理活动周期下拉
			RpaProcessingActivityCycleList: RpaProcessingActivityCycleList,
			RpaSensitiveNumberList: RpaSensitiveNumberList,
			RpaSystemNetworkList: RpaSystemNetworkList,
			RpaCollectionChannelsList: RpaCollectionChannelsList,
			RpaNumberList: RpaNumberList,
			// 数据流图文件上传
			fileLists: [],
			//架构图文件上传
			RpaSystemFileLists: [],
			zhushi: false,
			modestate: false,
			lang: localStorage.getItem('lang').split('"')[1],
			isLang: true,
			env: process.env.VUE_APP_BASE_API,
			//新增数据字段弹窗
			showDataFields: false,
			radioStyle: {
				display: 'block',
				lineHeight: '30px',
			},
			// 新增数据字段单选状态
			radioValue: 2,
			//合并di的Id
			diId: null,
			disabled: false,
			otherflag: false,
			otherPurpose: false,
			inputValue: '',
			ifFlag: false, //判断是否可以返回的标志位
			ifvisible: false, //判断是否可以返回的标志位
			temporarily: undefined, // 暂存数据
			changvalue: '',
			RpaNoPIOrImportantInvolved: 0,
			RpaIfCompletedPIA: 0,
			initFromData: {
				DiId: undefined,
				Id: undefined,
				RpaActivityCycle: undefined,
				RpaActivityType: undefined,
				RpaCollectionChannels: undefined,
				RpaIfCompletedPIA: 0,
				RpaPIALinkUrl: '',
				RpaDataDetail: [],
				RpaNoPIOrImportantInvolved: false,
				RpaNoPIDescProcessedData: '',
				RpaDataController: undefined,
				RpaDataFlowDiagramDescribe: undefined,
				RpaFrequency: undefined,
				RpaId: undefined,
				RpaLeaderMaster: undefined,
				RpaLeaderRetinue: undefined,
				RpaName: undefined,
				RpaNumber: undefined,
				RpaObjective: undefined,
				RpaObjectiveOther: undefined,
				RpaProcessingActivityCycle: undefined,
				RpaSensitiveNumber: undefined,
				RpaState: undefined,
				RpaStoragePeriod: undefined,
				RpaSystemArchitectureDescribe: undefined,
				RpaUpload: [],
			}, //初始化一个实体，用于数据载荷
			initDpiaFromData: {
				DpiaRpaId: undefined,
				DpiaModelId: undefined,
				DpiaName: undefined,
			}, //初始化一个实体，DPIA Model
			toPage: '',
			rpaInfo: {},
			Xians: [
				{
					label: '线上',
					labelEn: 'Online',
					value: 1,
				},
				{
					label: '线下',
					labelEn: 'Offline',
					value: 2,
				},
			],
			ifValidated: false,
			batchVisible: false,
			selectedRowKeys: [],
			batchUpForm: this.$form.createForm(this),
			checkedValues: [],
			btnDisabled: false,
			cloneDiDataLists: [],
			ifLoading: false,
			tempId: 1,
			isConditionMet: false, //必选一个
			pia: true,
			Re: 0,
			NonPIedit: 0,
			PIAedit: 0,
			dataDetailInfoTablesEdit: [],
			RpaActivityCycle: '', //数据处理活动阶段
			RpaActivityType: '', //数据处理活动类型

			lazzyLoading: false,
			pageNo: 1, // 当前加载的页数
			pageSize: 30, // 每页加载的数据个数
			datasourceCount: 0, // 服务器返回的响应信息
			fetchUserContent: '', // 存储搜索的关键词
			listNameArr: [],
			listNameArr2: [],
			// 新需求
            isHovered:false,
            RpaDataTay:[],
            Others:[],//Other
            inputVisible: false,
            inputValue: '',
		}
	},
	created() {
		this.init()
	},
	async mounted() {
		// 获取列表
		this.getDatasourceList('')
		let that = this
		window.addEventListener('setItemEvent', function (e) {
			if (e.key == 'lang') {
				that.getAllInfo()
				var lang = JSON.parse(e.value)
				if (lang === 'zh-EN') {
					that.tx(1)
					that.filterSearchInputOptionEn()
				} else {
					that.tx()
					that.filterSearchInputOption()
				}
				that.lang = lang
				setTimeout(() => {
					if (that.ifValidated)
						that.form.validateFields({ force: true })
				})
			}
		})
	},
	watch: {
		async inputValue(value) {
			const { data } = await getUserList({
				UserEmail: value,
				UserName: value,
			})
			this.userList = data
		},
	},
	methods: {
		async getDatasourceList(content) {
			this.lazzyLoading = true
			try {
				console.log(this.pageNo, this.pageSize)
				// 将返回的数据解构赋值给 appidLists 变量
				const { data: appidLists, total } = await appIdCreatexl({
					types: 1,
					page: this.pageNo,
					pageSize: this.pageSize,
					content,
				})
				// 计算数据源的总数，等于返回的数据长度加上已有的数据长度
				this.datasourceCount = total
				// 判断已有的数据长度是否小于数据源的总数，如果是，就将返回的数据拼接到已有的数据后面
				if (this.appidLists.length < this.datasourceCount) {
					this.appidLists = this.appidLists.concat(appidLists)
                    const arr = this.appidLists.concat(appidLists);
                    const result = Array.from(new Set(arr.map(item => JSON.stringify(item)))).map(item => JSON.parse(item));
                    this.appidLists = result;
				}
              
			} catch (error) {
				console.error(error)
			} finally {
				this.lazzyLoading = false
			}
			this.pageNo += 1
		},
		async appendData(e) {
			const target = e.target
			// console.log('target.scrollTop', target.scrollTop);
			// console.log('target.offsetHeight', target.offsetHeight);
			// console.log('target.scrollHeight', target.scrollHeight);
			// console.log('this.pageNo', this.pageNo);
			// console.log('this.pageSize', this.pageSize);
			// console.log('this.datasourceCount', this.datasourceCount);
			// 如果目标元素不存在，就直接返回，避免报错
			if (!target) return
			// 如果目标元素的滚动距离加上元素的高度等于元素的滚动高度，表示滚动到了底部
			// 并且如果当前页码乘以每页的数量小于等于数据源的总数，表示还有更多的数据可以加载
			if (
				Math.ceil(target.scrollTop) + target.offsetHeight >=
					target.scrollHeight * 1 - 10 &&
				this.pageNo * this.pageSize < this.datasourceCount &&
				this.lazzyLoading === false
			) {
				// 调用 getDatasourceList 函数，获取更多的数据
				this.getDatasourceList(this.fetchUserContent)
			}
		},

		/**
		 * 父组件接收子组件传递的值
		 * @param data
		 */
		getChildValue(data, ifModal) {
			// 写入到数据列表中
			this.appidLists.push(data)
			this.diDataLists = deepClone(this.cloneDiDataLists)
			this.$nextTick(() => {
				// 获取到数据类型，指定赋值
				if (ifModal == 1) {
					let list =
						this.batchUpForm.getFieldValue(
							this.temporarily.types
						) || []
					if (list.indexOf(data.value) === -1) {
						list.push(data.value)
						this.batchUpForm.setFieldsValue({
							[this.temporarily.types]: list,
						})
					}
				} else {
					var tempList = JSON.parse(
						JSON.stringify(this.cloneDiDataLists)
					)
					let temp = tempList.filter(
						(item) => item.Id === this.temporarily.Id
					)[0]
					if (
						temp[this.temporarily.types].indexOf(data.value) === -1
					) {
						temp[this.temporarily.types].push(data.value)
					}
					this.diDataLists = tempList
					this.loading = false
				}
			})
		},
		// 打开新增
		onChange1(e, type) {
			this.temporarily = e || {}
			this.temporarily.types = type
			this.$refs.addappid.open('', '', '', e ? 0 : 1)
			this.cloneDiDataLists = deepClone(this.diDataLists)
		},
		// 监听搜索
		async fetchUser(value) {
			// 获取APPID下拉数据
			let content = value

			// 校验 value 参数，如果为空或非法，直接返回
			if (!content || !/^\w+$/.test(content)) return
			this.fetchUserContent = content
			try {
				// 清空 appidLists 属性，避免数据混乱
				this.appidLists = []
				this.pageNo = 0
				this.getDatasourceList(content)
			} catch (error) {
				// 处理异步请求的异常情况，打印错误信息或者给用户提示
				console.error(error)
				// 或者 alert('搜索失败，请重试')
			}
		},

		filte1rOption(value) {
			this.inputValue = value
		},
		//点击确定
		async submitadd() {
			const {
				form: { validateFields },
			} = this

			// 按钮loading
			this.loading = true
			this.ifValidated = true
			// validateFields 是校验form表单数据
			// force: true 是默认所有字段都校验
			// values 表单的值
			validateFields({ force: true }, async (err, values) => {
				let systemControllerSourceData = this.systemControllerSourceData
                if (this.RpaDataTay.length == 0){
                    message.error("请填写数据控制者")
                    return
                }
                let arr =[] //数据控制者
                systemControllerSourceData.map((item)=>{
                    this.RpaDataTay.map((it)=>{
                        if (item.label === it){
                            arr.push(item.value)
                        }
                    })
                })
                values.RpaDataController = arr
                values.RpaDataControllerOther =this.Others.join(',')
				if (!err) {
					this.ifFlag = true
					this.ifLoading = true
					let resValue = deepClone(values)
					if (values.RpaNoPIOrImportantInvolved) {
						values.RpaNoPIOrImportantInvolved = 1
						this.pia = false
					} else {
						values.RpaNoPIOrImportantInvolved = 0
					}
					if (values.RpaIfCompletedPIA == 1) {
						values.RpaDataDetail = []
						this.pia = false
					} else {
						if (values.RpaNoPIOrImportantInvolved == 1) {
							values.RpaDataDetail = []
						} else {
							if (this.diDataLists.length < 1) {
								this.$message.error(
									this.$t(
										'user.verification-code.required111566110577342'
									) //数据详情需要有内容
								)
								return
							}
							for (var i = 0; i < this.diDataLists.length; i++) {
								if (
									!this.diDataLists[i].DataCity ||
									this.diDataLists[i].DataCity.length == 0
								) {
									this.$message.error(
										this.$t('menu.account.logout1122992244')
									) // 城市不能为空
									return
								}
								if (
									!this.diDataLists[i].DataDeposit ||
									this.diDataLists[i].DataDeposit.length == 0
								) {
									this.$message.error(
										this.$t('menu.account.logout1122992255')
									)
									return
								}
								if (
									!this.diDataLists[i].DataItem ||
									this.diDataLists[i].DataDeposit.length == 0
								) {
									this.$message.error(
										this.$t(
											'menu.account.logout11229922558888'
										)
									)
									return
								}
								if (
									!this.diDataLists[i].DataSource ||
									this.diDataLists[i].DataSource.length == 0
								) {
									this.$message.error(
										this.$t('menu.account.logout1122992266')
									)
									return
								}
								if (
									!this.diDataLists[i].DataDestination ||
									this.diDataLists[i].DataDestination
										.length === 0
								) {
									this.$message.error(
										this.$t('menu.account.logout1122992277')
									)
									// 数据目的地不能为空
									return
								}
							}
							let arr22 = []
							let arr333 = []
							this.diDataLists.forEach((item) => {
								arr22.push({
									value:
										Object.keys(item).indexOf(
											'DataLibraryId'
										) === -1
											? item.DetailDataLibraryId
											: item.DataLibraryId,
									label: item.DataAssetsId,
								})
							})
							arr22.forEach((item) => {
								if (item.label != undefined) arr333.push(item)
							})

							this.arr11 = arr333
							if (this.arr11.length == 0) {
								this.modestate = false
							} else {
								this.diList = Array.from(
									new Set(this.arr11.map((obj) => obj.value))
								).map((value) =>
									this.arr11.find(
										(obj) => obj.value === value
									)
								)
								this.modestate = true
							}
							for (var i = 0; i < this.diDataLists.length; i++) {
								if (!this.diDataLists[i].DataAssetsId) {
									this.flagstate = 1
								}
							}
							// DI数据详情
							resValue.RpaDataDetail = this.diDataLists
							var tempRpaDataDetail = []
							if (
								resValue.RpaDataDetail != null &&
								resValue.RpaDataDetail != undefined
							) {
								for (
									var i = 0;
									i < resValue.RpaDataDetail.length;
									i++
								) {
									// 删除ID
									if (!this.types) {
										delete resValue.RpaDataDetail[i].Id
									}
									resValue.RpaDataDetail[i].RpaId =
										resValue.Id

									if (
										Object.keys(
											resValue.RpaDataDetail[i]
										).indexOf('DataLibraryId') != -1
									) {
										if (
											resValue.RpaDataDetail[i]
												.DataLibraryId != 0
										) {
											resValue.RpaDataDetail[
												i
											].DetailDataLibraryId =
												resValue.RpaDataDetail[
													i
												].DataLibraryId
											resValue.RpaDataDetail[i].DataItem =
												parseInt(
													resValue.RpaDataDetail[i]
														.DataItem
												)
										}
									} else {
										resValue.RpaDataDetail[i].DataItem =
											parseInt(
												resValue.RpaDataDetail[i]
													.DataItem
											)
									}
									// 公共城市字段
									var DataCityType =
										typeof resValue.RpaDataDetail[i]
											.DataCity
									if (DataCityType == 'object') {
										console.log(
											'DataCityType:',
											DataCityType
										)
										resValue.RpaDataDetail[i].DataCity =
											resValue.RpaDataDetail[
												i
											].DataCity.join(',')
									} else {
										resValue.RpaDataDetail[i].DataCity =
											resValue.RpaDataDetail[
												i
											].DataCity.toString()
									}

									// 数据存放地
									var DataDepositType =
										typeof resValue.RpaDataDetail[i]
											.DataDeposit
									if (DataDepositType == 'object') {
										resValue.RpaDataDetail[i].DataDeposit =
											resValue.RpaDataDetail[
												i
											].DataDeposit.join(',')
									} else {
										resValue.RpaDataDetail[i].DataDeposit =
											resValue.RpaDataDetail[
												i
											].DataDeposit.toString()
									}

									// 数据来源
									var DataSourceType =
										typeof resValue.RpaDataDetail[i]
											.DataSource
									if (DataSourceType == 'object') {
										resValue.RpaDataDetail[i].DataSource =
											resValue.RpaDataDetail[
												i
											].DataSource.join(',')
									} else {
										resValue.RpaDataDetail[i].DataSource =
											resValue.RpaDataDetail[
												i
											].DataSource.toString()
									}

									// 数据目的地
									var DataDestinationType =
										typeof resValue.RpaDataDetail[i]
											.DataDestination
									if (DataDestinationType == 'object') {
										console.log(
											'DataDestinationType:',
											DataDestinationType
										)
										resValue.RpaDataDetail[
											i
										].DataDestination =
											resValue.RpaDataDetail[
												i
											].DataDestination.join(',')
									} else {
										resValue.RpaDataDetail[
											i
										].DataDestination =
											resValue.RpaDataDetail[
												i
											].DataDestination.toString()
									}

									tempRpaDataDetail.push(
										resValue.RpaDataDetail[i]
									)
								}
								resValue.RpaDataDetail = tempRpaDataDetail
							}
						}
						//数据流程图
						if (
							this.fileLists.length === 0 &&
							!this.initFromData.RpaDataFlowDiagramDescribe
						) {
							this.$message.error(
								this.$t('rpa.detail.tip.shujuliutu')
							)
							return
						}
						//系统架构图
						if (
							this.RpaSystemFileLists.length === 0 &&
							!this.initFromData.RpaSystemArchitectureDescribe
						) {
							this.$message.error(this.$t('rpa.detail.tip.xtjg'))
							return
						}
					}
					if (this.flagstate == 1) {
						this.showDataFields = true
						this.diId = ''
					} else {
						// this.submitCreate()
						this.showDataFields = false
						// if (this.$route.query.state == 'edit') {
						//   this.createQuestionStatus = false;
						// } else {
						this.createQuestionStatus = true
						await this.$nextTick()

						resValue.RpaObjective = this.$t(resValue.RpaObjective)
						this.createDataModal = true

						// this.form.setFieldsValue({DpiaRpaId:this.DpiaRpaId,DpiaName:this.DpiaRpaId})
						// }
						// 将数据做基础的处理
						if (resValue.RpaActivityCycle != undefined) {
							resValue.RpaActivityCycle =
								resValue.RpaActivityCycle.join()
						}
						if (resValue.RpaActivityType != undefined) {
							resValue.RpaActivityType =
								resValue.RpaActivityType.join()
						}
						if (resValue.RpaDataController != undefined) {
							resValue.RpaDataController =
								resValue.RpaDataController.toString()
							console.log(resValue.RpaDataController)
						}
						if (resValue.RpaSystemNetwork != undefined) {
							resValue.RpaSystemNetwork =
								resValue.RpaSystemNetwork.toString()
						}

						let url = []
						//处理数据流图url
						if (this.fileLists.length > 0) {
							this.fileLists.forEach((item) => {
								let RpaUploadUrlUrl = []
								RpaUploadUrlUrl = item.url
									.split('/')
									.splice(-2, 2)

								console.log(
									'url',
									RpaUploadUrlUrl,
									RpaUploadUrlUrl.join('/')
								)

								url.push({
									RpaUploadUrl: RpaUploadUrlUrl.join('/'),
									RpaUploadType: item.RpaUploadType,
								})
							})
						}
						//处理架构图url
						if (this.RpaSystemFileLists.length > 0) {
							this.RpaSystemFileLists.forEach((item) => {
								let RpaSystemFileListsUrl = []
								RpaSystemFileListsUrl = item.url
									.split('/')
									.splice(-2, 2)
								url.push({
									RpaUploadUrl:
										RpaSystemFileListsUrl.join('/'),
									RpaUploadType: item.RpaUploadType,
								})
							})
						}
						resValue.RpaUpload = url
						// resValue.DiId = 333
						// 指定保存还是提交(1:草稿(Draft),2:上线(Active),3:下线(Offline))
						resValue.RpaState = 2

						// 错误
						if (resValue.RpaNoPIOrImportantInvolved) {
							resValue.RpaNoPIOrImportantInvolved = 1
						} else {
							resValue.RpaNoPIOrImportantInvolved = 0
						}
						console.log(resValue)
						const { data } = await rpaCreate(deepClone(resValue))
						this.rpaidd = data
						let arr = Array('RPA' + data, resValue.RpaName)
						if (resValue.RpaNoPIOrImportantInvolved == 1) {
							this.RpaNoPIOrImportantInvolved =
								values.RpaNoPIOrImportantInvolved
							this.RpaIfCompletedPIA = values.RpaIfCompletedPIA
							this.form1.setFieldsValue({
								DpiaRpaId: arr.join('/'),
								DpiaModelId: 1001,
								DpiaName: 'DPIA-' + arr.join('/'),
							})
						} else if (values.RpaIfCompletedPIA == 1) {
							this.RpaNoPIOrImportantInvolved =
								values.RpaNoPIOrImportantInvolved
							this.RpaIfCompletedPIA = values.RpaIfCompletedPIA
							this.form1.setFieldsValue({
								DpiaRpaId: arr.join('/'),
								DpiaModelId: 1000,
								DpiaName: 'DPIA-' + arr.join('/'),
							})
						} else {
							this.form1.setFieldsValue({
								DpiaRpaId: arr.join('/'),
								DpiaModelId: 106,
								DpiaName: 'DPIA-' + arr.join('/'),
							})
						}

						this.$message.success(
							this.$t(
								'user.verification-code.required111566110577308'
							)
						)
						this.createDataModal = true
					}
				} else {
					setTimeout(() => {
						this.ifLoading = false
					}, 600)
				}
				this.ifLoading = false
			})
			this.ifLoading = false
		},
		onChanges(e) {
			this.changvalue = e
			console.log('e', e)
		},
		RpaIfCompletedPIA(e) {
			console.log(12)
			// this.changvalue = e;
		},
		filterOption(input, option) {
			return (
				option.componentOptions.children[0].text.indexOf(
					input.toLowerCase()
				) >= 0
			)
		},
		async filterSearchInputOption(inputs, option) {
			//数据详情的数据字段
			const { data: dataItemsSearchData } = await dccDataItemsSelect({
				search: inputs,
			})
			this.dataItemsSearchData = dataItemsSearchData
		},
		async filterSearchInputOptionEn(inputs, option) {
			//数据详情的数据字段
			this.dataItemsSearchData = []
			const { data: dataItemsSearchData } = await dccDataItemsSelect({
				search: inputs,
			})
			for (var i = 0; i < dataItemsSearchData.length; i++) {
				this.dataItemsSearchData.push({
					label: dataItemsSearchData[i].labelEn,
					value: dataItemsSearchData[i].value,
				})
			}
		},
		//新增数据字段下拉
		changegai(value) {
			console.log('xxxxxx:', value)
			console.log('value-------', value)
			this.diId = value
		},
		//回显到input
		selectinput(value) {
			console.log(value)
			console.log(this.rpaListData)
			this.selinput = value
			let inpute = ''
			for (let i = 0; i < this.rpaListData.length; i++) {
				if (this.rpaListData[i].value == value) {
					inpute = this.rpaListData[i].label
				}
			}
			this.inpute = inpute
			console.log('this.inpue', this.inpute)
			this.form.setFieldsValue({ DpiaName: this.inpute })
		},
		async tx(types) {
			if (types == 1) {
				// 加载数据处理活动周期
				const { data: dataProcessingActivityCycleData } =
					await configurationSelect({ state: 6, types: 1 })
				this.dataProcessingActivityCycleData =
					dataProcessingActivityCycleData
				// 加载数据处理活动类型
				const { data: processingActivityTypesData } =
					await configurationSelect({ state: 7, types: 1 })
				this.processingActivityTypesData = processingActivityTypesData
			} else {
				// 加载数据处理活动周期
				const { data: dataProcessingActivityCycleData } =
					await configurationSelect({ state: 6 })
				this.dataProcessingActivityCycleData =
					dataProcessingActivityCycleData
				// 加载数据处理活动类型
				const { data: processingActivityTypesData } =
					await configurationSelect({ state: 7 })
				this.processingActivityTypesData = processingActivityTypesData
			}
		},
		closeDrawer() {
			this.dataDetailInfoTables = []
			this.addAppForm = {}
			this.modalVisible = false
		},
		async handleChangeAppid(value, index) {
			const { data } = await appIdDetail({ id: index.key })

			this.diForm.setFieldsValue({
				AppidName: data.AppName,
				AppidMaster: data.AppOwner,
				AppidDepartMent: data.AppDepartment,
				BbaAppId: data.BbaAppId,
				BmwAppId: data.BmwAppId,
				FeatherId: data.FeatherId,
			})
		},
		async showCreateRpaMiniModel() {
			// 新增数据字段的弹窗
			if (this.radioValue == 0) {
				// 默认什么都没选
				this.$message.error(this.$t('user.v18'))
			} else if (this.radioValue == 1) {
				// 判断是否有选择DI
				if (!this.diId) {
					this.$message.error(this.$t('user.v19'))
				} else {
					// 新增的数据字段,合并
					await this.submitCreate()
					// 关闭数据弹窗
					this.showDataFields = false
					// 展开DPIA的弹窗
					this.createQuestionStatus = true
				}
			} else if (this.radioValue == 2) {
				// 生成新的DI
				await this.submitCreate()
				// 关闭数据弹窗
				this.showDataFields = false
				// 展开DPIA的弹窗
				this.createQuestionStatus = true
			}
		},
		async showModel(record) {
			this.modalVisible = true
			this.modalTitle = this.$t(
				'user.verification-code.required11156677888888'
			)
			const { data: dataInfo } = await rpaDiDetail({
				Id: record.DataLibraryId || record.DetailDataLibraryId,
			})
			if (dataInfo.DataLibraryControllerOther != '') {
				this.otherflag = true
			} else {
				this.otherflag = false
			}
			let arr1 = []
			let arr3 = []
			if (dataInfo.DataLibraryController == '') {
				arr1 = undefined
			} else {
				arr1 = dataInfo.DataLibraryController.split(',')
				arr1.forEach((item) => {
					arr3.push(parseInt(item))
				})
			}
			await this.$nextTick()
			this.diForm.setFieldsValue({
				DataLibraryAppidId: dataInfo.DataLibraryAppidId,
				DataLibraryCreateTime: dataInfo.DataLibraryCreatetime,
				DataLibraryUpdateTime: dataInfo.DataLibraryUpdatetime,
				DataLibraryController: arr3,
				DataLibraryControllerOther: dataInfo.DataLibraryControllerOther,
				DataLibraryEnvironment: dataInfo.DataLibraryEnvironment,
				DataLibraryEntities: dataInfo.DataLibraryEntities,
				DataAssetsId: dataInfo.DataAssetsId,
				DataLibraryUser: dataInfo.DataLibraryUser,
				Id: dataInfo.Id,
				BmwAppId: dataInfo.BmwAppId,
				BbaAppId: dataInfo.BbaAppId,
				FeatherId: dataInfo.FeatherId,
			})
			this.handleChangeAppid('', { key: dataInfo.DataLibraryAppidId })

			let tempLists = []
			await this.$nextTick()
			if (dataInfo.Details) {
				for (var i = 0; i < dataInfo.Details.length; i++) {
					var arr5 = []
					dataInfo.Details[i].DataCity.split(',').forEach((item) => {
						arr5.push(parseInt(item))
					})
					var arr6 = []
					dataInfo.Details[i].DataDeposit.split(',').forEach(
						(item) => {
							arr6.push(parseInt(item))
						}
					)
					var arr7 = []
					dataInfo.Details[i].DataSource.split(',').forEach(
						(item) => {
							arr7.push(parseInt(item))
						}
					)
					var arr8 = []
					dataInfo.Details[i].DataDestination.split(',').forEach(
						(item) => {
							arr8.push(parseInt(item))
						}
					)
					var tempItems = {
						Id: dataInfo.Details[i].Id,
						key: dataInfo.Details[i].Id,
						DataItemStr: dataInfo.Details[i].DataItemsStr,
						DataItem: dataInfo.Details[i].DataItem,
						DataLevelStr: dataInfo.Details[i].DataLevelStr,
						DataLevel: dataInfo.Details[i].SourceDataLevel, // 数据级别
						DataSensitiveStr:
							dataInfo.Details[i].DataSensitivityStr, // 数据敏感度
						DataSensitive: dataInfo.Details[i].SourceDataSensitive,
						...dataInfo.Details[i],
						DataCity: arr5,
						DataDeposit: arr6,
						DataSource: arr7,
						DataDestination: arr8,
					}
					tempLists.push(tempItems)
				}
			}
			this.dataDetailInfoTables = tempLists
		},
		//添加详情删除
		async delxiangqing(record) {
			try {
				if (record.DataItem == '') {
					this.flagstate = 0
				}
				if (!record.Id && record.tempId) {
					const dataSource = [...this.diDataLists]
					this.diDataLists = dataSource.filter(
						(item) => item.tempId != record.tempId
					)
					return
				} else if (this.$route.query.state == 'edit') {
					await rpaDelDetail({ Id: record.Id })
					const dataSource = [...this.diDataLists]
					this.diDataLists = dataSource.filter(
						(item) => item.Id != record.Id
					)
				} else if (this.$route.query.state == 'add') {
					const dataSource = [...this.diDataLists]
					this.diDataLists = dataSource.filter(
						(item) => item.Id != record.Id
					)
				}
				for (let i = 0; i < this.diDataLists.length; i++) {
					if (!this.diDataLists[i].DataAssetsId) {
						this.flagstate = 1
					} else {
						this.flagstate = 0
					}
				}
				// 传过来的id直接请求删除api
				this.$message.success(
					this.$t('user.verification-code.required111566110577133')
				)
				// 重新初始化列表刷新数据
			} catch (error) {
				this.$message.error(error)
			} finally {
			}
		},
		async handleCreateQuestionSubmit() {
			const {
				form1: { validateFields },
			} = this
			// 按钮loading
			this.loading = true
			// validateFields 是校验form表单数据
			// force: true 是默认所有字段都校验
			// values 表单的值
			validateFields({ force: true }, async (err, values) => {
				if (!err) {
					try {
						this.confirmLoading = true
						const params = { ...values }
						console.log('params', params)
						if (
							this.RpaNoPIOrImportantInvolved == 1 ||
							this.RpaIfCompletedPIA == 1
						) {
							const { data } = await dpiaQuestionsCreate({
								DpiaRpaId: this.rpaidd,
								DpiaModelId: params.DpiaModelId,
								DpiaName: params.DpiaName,
							})
							this.$message.success(
								this.$t(
									'user.verification-code.required111566110577326'
								)
							)
							this.createQuestionStatus = false
							this.$router.push({
								path: '/dpia/question',
								query: { id: data.Id },
							})
						} else {
							const { data } = await dpiaQuestionsCreate({
								DpiaRpaId: this.rpaidd,
								DpiaModelId: params.DpiaModelId,
								DpiaName: params.DpiaName,
							})
							this.$message.success(
								this.$t(
									'user.verification-code.required111566110577326'
								)
							)
							this.createQuestionStatus = false
							this.$router.push({
								path: '/dpia/question',
								query: { id: data.Id },
							})
						}
					} catch (error) {
						this.$message.error(error)
					} finally {
						this.loading = false
						this.confirmLoading = false
					}
				} else {
					setTimeout(() => {
						this.loading = false
					}, 600)
				}
			})
		},
		async handleCreateQuestionCancel() {
			this.createQuestionStatus = false
			this.$router.push({ path: '/rpa' })
		},
		async handleDiChange(e) {
			try {
				var tempLists = []
				const { data } = await childataItems({ id: e })
				for (var i = 0; i < this.diDataLists.length; i++) {
					if (this.diDataLists[i].DataItemsStr == e) {
						this.diDataLists[i].DataLevelStr = data[0].DateLevel
						this.diDataLists[i].DataSensitivityStr =
							data[0].SensitivityLevel
						this.diDataLists[i].DataItem = e
					}
					tempLists.push(this.diDataLists[i])
				}
				this.diDataLists = tempLists
				console.log(this.diDataLists)
			} catch (error) {
				this.$message.error(error)
			}
		},
		createDataModal() {
			// 新增数据字段执行
			this.del == '1'
			if (this.diDataLists == null) {
				this.diDataLists = []
			}
			this.diDataLists.push({
				Id: this.diDataLists.length + 1,
				DataSensitivityStr: '-',
				RpaType: 2,
				DataSource: [],
				DataDestination: [],
			})

			console.log(
				'=========> 新增数据字段后的数据样子:',
				this.diDataLists
			)
		},
		async handleChangeAssets(id) {
			this.rpaDidataLists = []
			try {
				const { data } = await dataLibraryDetail({ Id: id })
				console.log('datalist', data)
				let tempLists = []
				for (var i = 0; i < data.Details.length; i++) {
					console.log('data.Details', data.Details[i])
					let arr5 = []
					let arr6 = []
					let arr7 = []
					let arr8 = []
					data.Details[i].DataAssetsId = data.DataAssetsId
					data.Details[i].DataDeposit.split(',').forEach((item) => {
						arr8.push(parseInt(item))
					})
					data.Details[i].DataSource.split(',').forEach((item) => {
						arr7.push(parseInt(item))
					})
					data.Details[i].DataCity.split(',').forEach((item) => {
						arr5.push(parseInt(item))
					})
					data.Details[i].DataDestination.split(',').forEach(
						(item) => {
							arr6.push(parseInt(item))
						}
					)
					console.log('arr6', arr6)
					data.Details[i].DataDestination = arr6.filter(
						(item) => !isNaN(item)
					)
					data.Details[i].DataSource = arr7.filter(
						(item) => !isNaN(item)
					)
					data.Details[i].DataCity = arr5.filter(
						(item) => !isNaN(item)
					)
					data.Details[i].DataDeposit = arr8.filter(
						(item) => !isNaN(item)
					)
					tempLists.push(data.Details[i])
				}
				console.log('tempLists', tempLists)
				this.rpaDidataLists = tempLists
				console.log('this.rpaDidataLists')
				console.log('this.rpaDidataLists', this.rpaDidataLists)
			} catch (error) {
				this.$message.error(error)
				console.log(error)
			}
		},
		handleDiCancel() {
			// DI导入取消
			this.visible = false
			this.rpaDidataLists = []
			this.handleChangeAssetsSelect = undefined
		},
		handleDiSubmit() {
			this.handleDiSubmitStatus = true
			this.rpaDidataLists = []
			this.selectedRows.forEach((key, val) => {
				let state = 0
				this.diDataLists.find((item) => {
					if (item.Id == key.Id) {
						state = 1
						this.$message.error('数据重复')
						return
					}
				})
				if (state == 1) {
					// this.$message.error('数据重复')
					return
				}
				key.DataItemsStr = key.DataItem
				this.diDataLists.push(key)
			})
			let arr = []
			this.selectedRows.forEach((item) => {
				if (arr.length > 0) {
					if (arr.findIndex((v) => v.value != item.value)) {
						arr.push(item)
					}
					console.log(arr)
				} else {
					arr.push({
						value: item.DataLibraryId,
						label: item.DataAssetsId,
					})
				}
			})
			this.arr11.push(arr)
			// DI导入提交
			this.visible = false
			this.rpaDidataLists = []
			this.handleChangeAssetsSelect = undefined
		},
		handleFocus() {
			this.placeholderText = ''
		},
		//保存草稿
		warning(type) {
			if (type == 1) {
				const {
					form: { validateFields },
				} = this
				validateFields({ force: false }, async (err, values) => {
					let that = this
					if (
						that.PIAedit == 0 &&
						values.RpaIfCompletedPIA == 1 &&
						that.Re == 1
					) {
						//PIA版本
						that.$confirm({
							title: '提示?',
							content:
								'您已修改RPA为PIA版本,DPIA模版会同步为PIA版本,之前提交的DPIA答卷和DCO已审核的内容都将丢失,是否确认继续？',
							onOk() {
								that.submitadd()
							},
							onCancel() {},
						})
					} else if (
						that.NonPIedit == 0 &&
						values.RpaNoPIOrImportantInvolved == 1 &&
						that.Re == 1
					) {
						// Non-Pi版本
						that.$confirm({
							title: '提示?',
							content:
								'您已修改RPA为Non-PI版本,DPIA模版会同步为Non-PI版本,之前提交的DPIA答卷和DCO已审核的内容都将丢失,是否确认继续？',
							onOk() {
								that.submitadd()
							},
							onCancel() {},
						})
					} else if (
						((that.NonPIedit == 1 &&
							values.RpaNoPIOrImportantInvolved == 0) ||
							(that.PIAedit == 1 &&
								values.RpaIfCompletedPIA == 0)) &&
						that.Re == 1
					) {
						// 通用版本
						that.$confirm({
							title: '提示?',
							content:
								'您已修改RPA为通用版本,DPIA模版会同步为通用版本,之前提交的DPIA答卷和DCO已审核的内容都将丢失,是否确认继续？',
							onOk() {
								that.submitadd()
							},
							onCancel() {},
						})
					} else if (
						that.diDataLists.length != that.diDataLists.length &&
						that.Re == 1
					) {
						that.$confirm({
							title: '提示?',
							content:
								'您已修改数据详情,与该部分内容相关的DPIA题目将会重置,您需要重新答题,需要重新作答的题目, 已高亮显示, 是否确认继续？',
							onOk() {
								that.submitadd()
							},
							onCancel() {},
						})
						// RpaActivityCycle //数据处理活动阶段
						// RpaActivityType //数据处理活动类型
					} else if (
						(that.RpaActivityCycle != values.RpaActivityCycle ||
							RpaActivityType != values.RpaActivityType) &&
						that.Re == 1
					) {
						that.$confirm({
							title: '提示?',
							content:
								'您已修改了“数据处理活动阶段”与“数据处理活动类型”中的选项,新勾选的选项会触发DPRA新的章节。取消的选项中,已作答内容和DCO已经评估的内容都将丢失,是否确认继续？',
							onOk() {
								that.submitadd()
							},
							onCancel() {},
						})
					} else {
						// console.log(89)
						that.submitadd()
					}
				})
			} else {
				const {
					form: { validateFields },
				} = this
				validateFields({ force: false }, async (err, values) => {
					let that = this
					if (
						that.PIAedit == 0 &&
						values.RpaIfCompletedPIA == 1 &&
						that.Re == 1
					) {
						//PIA版本
						that.$confirm({
							title: '提示?',
							content:
								'您已修改RPA为PIA版本,DPIA模版会同步为PIA版本,之前提交的DPIA答卷和DCO已审核的内容都将丢失,是否确认继续？',
							onOk() {
								that.submitSave()
							},
							onCancel() {},
						})
					} else if (
						that.NonPIedit == 0 &&
						values.RpaNoPIOrImportantInvolved == 1 &&
						that.Re == 1
					) {
						// Non-Pi版本
						that.$confirm({
							title: '提示?',
							content:
								'您已修改RPA为Non-PI版本,DPIA模版会同步为Non-PI版本,之前提交的DPIA答卷和DCO已审核的内容都将丢失,是否确认继续？',
							onOk() {
								that.submitSave()
							},
							onCancel() {},
						})
					} else if (
						((that.NonPIedit == 1 &&
							values.RpaNoPIOrImportantInvolved == 0) ||
							(that.PIAedit == 1 &&
								values.RpaIfCompletedPIA == 0)) &&
						that.Re == 1
					) {
						// 通用版本
						that.$confirm({
							title: '提示?',
							content:
								'您已修改RPA为通用版本,DPIA模版会同步为通用版本,之前提交的DPIA答卷和DCO已审核的内容都将丢失,是否确认继续？',
							onOk() {
								that.submitSave()
							},
							onCancel() {},
						})
					} else if (
						that.diDataLists.length != that.diDataLists.length &&
						that.Re == 1
					) {
						that.$confirm({
							title: '提示?',
							content:
								'您已修改数据详情,与该部分内容相关的DPIA题目将会重置,您需要重新答题,需要重新作答的题目, 已高亮显示, 是否确认继续？',
							onOk() {
								that.submitSave()
							},
							onCancel() {},
						})
						// RpaActivityCycle //数据处理活动阶段
						// RpaActivityType //数据处理活动类型
					} else if (
						(that.RpaActivityCycle != values.RpaActivityCycle ||
							RpaActivityType != values.RpaActivityType) &&
						that.Re == 1
					) {
						that.$confirm({
							title: '提示?',
							content:
								'您已修改了“数据处理活动阶段”与“数据处理活动类型”中的选项,新勾选的选项会触发DPRA新的章节。取消的选项中,已作答内容和DCO已经评估的内容都将丢失,是否确认继续？',
							onOk() {
								that.submitSave()
							},
							onCancel() {},
						})
					} else {
						that.submitSave()
					}
				})
			}
		},
		submitSave() {
			const {
				form: { validateFields },
			} = this

			// 按钮loading
			this.loading = true
			// validateFields 是校验form表单数据
			// force: true 是默认所有字段都校验
			// values 表单的值
			validateFields({ force: false }, async (err, values) => {
				let systemControllerSourceData = this.systemControllerSourceData
                let arr =[] //数据控制者
                systemControllerSourceData.map((item)=>{
                    this.RpaDataTay.map((it)=>{
                        if (item.label === it){
                            arr.push(item.value)
                        }
                    })
                })
                values.RpaDataController = arr
                values.RpaDataControllerOther =this.Others.join(',')
				try {
					if (values.RpaIfCompletedPIA == 1) {
						values.RpaDataDetail = []
					}
					if (values.RpaIfCompletedPIA == 1) {
						values.RpaDataDetail = []
					}
					if (values.RpaNoPIOrImportantInvolved) {
						values.RpaNoPIOrImportantInvolved = 1
						this.pia = false
					} else {
						values.RpaNoPIOrImportantInvolved = 0
					}
					// 选择新增DI
					this.ifLoading = true
					if (this.radioValue == 1) {
						if (!this.DiId) {
							// this.$message.error(this.$t('menu.account.logout1122992277'))
						} else {
							console.log('this.diid', this.diid)
							values['DiId'] = this.diid
						}
					} else {
						values['DiId'] = 0
					}
					// 将数据做基础的处理
					if (values.RpaActivityCycle != undefined) {
						values.RpaActivityCycle = values.RpaActivityCycle.join()
					}
					if (values.RpaActivityType != undefined) {
						values.RpaActivityType = values.RpaActivityType.join()
					}
					if (values.RpaDataController != undefined) {
						values.RpaDataController =
							values.RpaDataController.toString()
					}

					if (values.RpaSystemNetwork != undefined) {
						values.RpaSystemNetwork =
							values.RpaSystemNetwork.toString()
					}
					// DI数据详情
					values.RpaDataDetail = this.diDataLists
					let url = []
					//处理数据流图url
					if (this.fileLists.length > 0) {
						this.fileLists.forEach((item) => {
							let RpaUploadUrlUrl = []
							RpaUploadUrlUrl = item.url.split('/').splice(-2, 2)
							console.log(
								RpaUploadUrlUrl,
								RpaUploadUrlUrl.join('/')
							)
							url.push({
								RpaUploadUrl: RpaUploadUrlUrl.join('/'),
								RpaUploadType: item.RpaUploadType,
							})
						})
					}
					//处理架构图url
					if (this.RpaSystemFileLists.length > 0) {
						this.RpaSystemFileLists.forEach((item) => {
							let RpaSystemFileListsUrl = []
							RpaSystemFileListsUrl = item.url
								.split('/')
								.splice(-2, 2)
							url.push({
								RpaUploadUrl: RpaSystemFileListsUrl.join('/'),
								RpaUploadType: item.RpaUploadType,
							})
						})
					}
					values.RpaUpload = url
					// values.DiId = 333
					// 指定保存还是提交(1:草稿(Draft),2:上线(Active),3:下线(Offline))
					values['RpaState'] = 1
					var tempRpaDataDetail = []
					// for (var i = 0; i < this.diDataLists.length; i++) {
					//   if (
					//     !this.diDataLists[i].DataCity ||
					//     this.diDataLists[i].DataCity.length == 0
					//   ) {
					//     this.$message.error(this.$t("menu.account.logout1122992244"));
					//     return;
					//   }
					//   if (
					//     !this.diDataLists[i].DataDeposit ||
					//     this.diDataLists[i].DataDeposit.length == 0
					//   ) {
					//     this.$message.error(this.$t("menu.account.logout1122992255"));

					//     return;
					//   }
					//   if (
					//     !this.diDataLists[i].DataItem ||
					//     this.diDataLists[i].DataDeposit.length == 0
					//   ) {
					//     this.$message.error(this.$t("menu.account.logout11229922558888"));

					//     return;
					//   }
					//   if (
					//     !this.diDataLists[i].DataSource ||
					//     this.diDataLists[i].DataSource.length == 0
					//   ) {
					//     console.log(this.diDataLists[i].DataSource);
					//     this.$message.error(this.$t("menu.account.logout1122992266"));

					//     return;
					//   }
					//   if (
					//     !this.diDataLists[i].DataDestination ||
					//     this.diDataLists[i].DataDestination.length == 0
					//   ) {
					//     this.$message.error(this.$t("menu.account.logout1122992277"));

					//     return;
					//   }
					// }
					console.log(
						'===============> values.RpaDataDetail:',
						values.RpaDataDetail
					)
					for (var i = 0; i < values.RpaDataDetail.length; i++) {
						// 删除ID
						if (!this.types) {
							delete values.RpaDataDetail[i].Id
						}
						values.RpaDataDetail[i].RpaId = values.Id

						// 公共城市字段
						values.RpaDataDetail[i].DataItem = parseInt(
							values.RpaDataDetail[i].DataItem
						)
						var DataCityType =
							typeof values.RpaDataDetail[i].DataCity
						if (DataCityType == 'object') {
							console.log('DataCityType:', DataCityType)
							values.RpaDataDetail[i].DataCity =
								values.RpaDataDetail[i].DataCity.join(',')
						} else {
							values.RpaDataDetail[i].DataCity =
								values.RpaDataDetail[i].DataCity?.toString()
						}

						// 数据存放地
						var DataDepositType =
							typeof values.RpaDataDetail[i].DataDeposit
						if (DataDepositType == 'object') {
							values.RpaDataDetail[i].DataDeposit =
								values.RpaDataDetail[i].DataDeposit.join(',')
						} else {
							values.RpaDataDetail[i].DataDeposit =
								values.RpaDataDetail[i].DataDeposit?.toString()
						}

						// 数据来源
						var DataSourceType =
							typeof values.RpaDataDetail[i].DataSource
						if (DataSourceType == 'object') {
							values.RpaDataDetail[i].DataSource =
								values.RpaDataDetail[i].DataSource.join(',')
						} else {
							values.RpaDataDetail[i].DataSource =
								values.RpaDataDetail[i].DataSource?.toString()
						}

						// 数据目的地
						var DataDestinationType =
							typeof values.RpaDataDetail[i].DataDestination
						if (DataDestinationType == 'object') {
							console.log(
								'DataDestinationType:',
								DataDestinationType
							)
							values.RpaDataDetail[i].DataDestination =
								values.RpaDataDetail[i].DataDestination.join(
									','
								)
						} else {
							values.RpaDataDetail[i].DataDestination =
								values.RpaDataDetail[
									i
								].DataDestination?.toString()
						}

						if ('DataLibraryId' in values.RpaDataDetail[i]) {
							// 如果是导入DI，就会有这个值
							if (values.RpaDataDetail[i].DataLibraryId != 0) {
								values.RpaDataDetail[i].DataDestination =
									values.RpaDataDetail[
										i
									].DataDestination?.toString()
								values.RpaDataDetail[i].DataItem = parseInt(
									values.RpaDataDetail[i].DataItem
								)
								values.RpaDataDetail[i].DataSource =
									values.RpaDataDetail[
										i
									].DataSource?.toString()
								values.RpaDataDetail[i].DetailDataLibraryId =
									values.RpaDataDetail[i].DataLibraryId
							}
							values.RpaDataDetail[i].DataDestination =
								values.RpaDataDetail[
									i
								].DataDestination?.toString()
						} else {
							// 新增数据字段
							values.RpaDataDetail[i].DataDestination =
								values.RpaDataDetail[
									i
								].DataDestination?.toString()
							values.RpaDataDetail[i].DataCity =
								values.RpaDataDetail[i].DataCity?.toString()
							values.RpaDataDetail[i].DataSource =
								values.RpaDataDetail[i].DataSource?.toString()
							values.RpaDataDetail[i].DataItem = parseInt(
								values.RpaDataDetail[i].DataItem
							)
						}

						tempRpaDataDetail.push(values.RpaDataDetail[i])
					}
					values.RpaDataDetail = tempRpaDataDetail
					const { data } = await rpaCreate({ ...values })
					console.log('caogao---', data)
					this.$message.success(
						this.$t(
							'user.verification-code.required111566110577308'
						)
					)
					// 返回列表
					this.ifFlag = true
					this.$router.push(this.toPage || '/rpa/service')
				} catch (error) {
					console.log(error)
					this.$message.error(error)
				} finally {
					this.loading = false
					this.ifLoading = false
				}
			})
		},
		// 取消
		cancellation() {
			this.$router.go(-1)
		},
		//提交
		submitCreate() {
			const {
				form: { validateFields },
			} = this
			// 按钮loading
			this.loading = true
			// validateFields 是校验form表单数据
			// force: true 是默认所有字段都校验
			// values 表单的值
			validateFields({ force: true }, async (err, values) => {
				if (!err) {
					try {
						if (values.RpaNoPIOrImportantInvolved) {
							values.RpaNoPIOrImportantInvolved = 1
						} else {
							values.RpaNoPIOrImportantInvolved = 0
						}
						if (values.RpaIfCompletedPIA == 1) {
							values.RpaDataDetail = []
						}
						if (values.RpaNoPIOrImportantInvolved == 1) {
							values.RpaDataDetail = []
						}
						let resValue = deepClone(values)
						// 将数据做基础的处理
						if (resValue.RpaActivityCycle != undefined) {
							resValue.RpaActivityCycle =
								resValue.RpaActivityCycle.join()
						}
						if (resValue.RpaActivityType != undefined) {
							resValue.RpaActivityType =
								resValue.RpaActivityType.join()
						}
						if (resValue.RpaDataController != undefined) {
							resValue.RpaDataController =
								resValue.RpaDataController.toString()
						}
						if (resValue.RpaSystemNetwork != undefined) {
							resValue.RpaSystemNetwork =
								resValue.RpaSystemNetwork.toString()
						}
						let url = []
						//处理数据流图url
						if (this.fileLists.length > 0) {
							this.fileLists.forEach((item) => {
								let RpaUploadUrlUrl = []
								RpaUploadUrlUrl = item.url
									.split('/')
									.splice(-2, 2)
								url.push({
									RpaUploadUrl: RpaUploadUrlUrl.join('/'),
									RpaUploadType: item.RpaUploadType,
								})
							})
						}
						//处理架构图url
						if (this.RpaSystemFileLists.length > 0) {
							this.RpaSystemFileLists.forEach((item) => {
								let RpaSystemFileListsUrl = []
								RpaSystemFileListsUrl = item.url
									.split('/')
									.splice(-2, 2)
								url.push({
									RpaUploadUrl:
										RpaSystemFileListsUrl.join('/'),
									RpaUploadType: item.RpaUploadType,
								})
							})
						}
						// 判断有没有DIID，有就带进去
						if (this.diId) {
							resValue['DiId'] = this.diId
						} else {
							resValue['DiId'] = 0
						}
						resValue.RpaUpload = url
						// resValue.DiId = 333
						// 指定保存还是提交(1:草稿(Draft),2:上线(Active),3:下线(Offline))
						resValue.RpaState = 2
						// DI数据详情
						resValue.RpaDataDetail = deepClone(this.diDataLists)
						var tempRpaDataDetail = []
						if (
							resValue.RpaDataDetail != null &&
							resValue.RpaDataDetail != undefined
						) {
							for (
								var i = 0;
								i < resValue.RpaDataDetail.length;
								i++
							) {
								// 删除ID
								if (!this.types) {
									delete resValue.RpaDataDetail[i].Id
								}
								resValue.RpaDataDetail[i].RpaId = resValue.Id

								if (
									Object.keys(
										resValue.RpaDataDetail[i]
									).indexOf('DataLibraryId') != -1
								) {
									if (
										resValue.RpaDataDetail[i]
											.DataLibraryId != 0
									) {
										resValue.RpaDataDetail[
											i
										].DetailDataLibraryId =
											resValue.RpaDataDetail[
												i
											].DataLibraryId
										resValue.RpaDataDetail[i].DataItem =
											parseInt(
												resValue.RpaDataDetail[i]
													.DataItem
											)
									}
								} else {
									resValue.RpaDataDetail[i].DataItem =
										parseInt(
											resValue.RpaDataDetail[i].DataItem
										)
								}
								// 公共城市字段
								var DataCityType =
									typeof resValue.RpaDataDetail[i].DataCity
								if (DataCityType == 'object') {
									console.log('DataCityType:', DataCityType)
									resValue.RpaDataDetail[i].DataCity =
										resValue.RpaDataDetail[i].DataCity.join(
											','
										)
								} else {
									resValue.RpaDataDetail[i].DataCity =
										resValue.RpaDataDetail[
											i
										].DataCity.toString()
								}

								// 数据存放地
								var DataDepositType =
									typeof resValue.RpaDataDetail[i].DataDeposit
								if (DataDepositType == 'object') {
									resValue.RpaDataDetail[i].DataDeposit =
										resValue.RpaDataDetail[
											i
										].DataDeposit.join(',')
								} else {
									resValue.RpaDataDetail[i].DataDeposit =
										resValue.RpaDataDetail[
											i
										].DataDeposit.toString()
								}

								// 数据来源
								var DataSourceType =
									typeof resValue.RpaDataDetail[i].DataSource
								if (DataSourceType == 'object') {
									resValue.RpaDataDetail[i].DataSource =
										resValue.RpaDataDetail[
											i
										].DataSource.join(',')
								} else {
									resValue.RpaDataDetail[i].DataSource =
										resValue.RpaDataDetail[
											i
										].DataSource.toString()
								}

								// 数据目的地
								var DataDestinationType =
									typeof resValue.RpaDataDetail[i]
										.DataDestination
								if (DataDestinationType == 'object') {
									console.log(
										'DataDestinationType:',
										DataDestinationType
									)
									resValue.RpaDataDetail[i].DataDestination =
										resValue.RpaDataDetail[
											i
										].DataDestination.join(',')
								} else {
									resValue.RpaDataDetail[i].DataDestination =
										resValue.RpaDataDetail[
											i
										].DataDestination.toString()
								}
								tempRpaDataDetail.push(
									Object.assign(resValue.RpaDataDetail[i])
								)
							}
							resValue.RpaDataDetail = tempRpaDataDetail
						}
						// RPA业务目的
						// await rpaCreate(deepClone(resValue))
						let { data } = await rpaCreate(deepClone(resValue))
						this.rpaidd = data
						resValue.RpaObjective = this.$t(resValue.RpaObjective)
						this.createDataModal = true
						let arr = Array(resValue.RpaId, resValue.RpaName)
						// 赋值
						await this.$nextTick()
						this.form1.setFieldsValue({
							DpiaRpaId: arr.join('/'),
							DpiaModelId: 106,
							DpiaName: 'DPIA-' + arr.join('/'),
						})
					} catch (error) {
						console.log(error)
						this.$message.error(error)
					} finally {
						this.loading = false
					}
				} else {
					setTimeout(() => {
						this.loading = false
					}, 600)
				}
			})
		},
		async openModal() {
			if (this.diDataLists == null) {
				this.diDataLists = []
			}
			this.getAllInfo()
			this.visible = true
		},
		async getAllInfo() {
			const { data: dataItemsSearchData } = await dccDataItemsSelect({
				types: 1,
			})
			this.dataItemsSearchData = []
			this.dataItemsSearchData = dataItemsSearchData
			// const { data: appidLists } = await appIdCreatexl({
			// 	content: '',
			// 	types: 1,
			// 	page: this.pageNo,
			// 	pageSize: this.pageSize
			// })
			// this.appidLists = appidLists
		},
		strToInt(strArr) {
			let arrs = []
			strArr.forEach((key, val) => {
				arrs.push(parseInt(key))
			})
			return arrs
		},
		async init() {
			try {
				this.userList = []
				const Lang = this.$route.query.itLang
				if (Lang) {
					this.itLang = JSON.parse(Lang)
				} else {
					// 加载数据处理活动周期
					const { data: dataProcessingActivityCycleData } =
						await configurationSelect({ state: 6 })
					this.dataProcessingActivityCycleData =
						dataProcessingActivityCycleData
					// 加载数据处理活动类型
					const { data: processingActivityTypesData } =
						await configurationSelect({ state: 7 })
					this.processingActivityTypesData =
						processingActivityTypesData
				}
				this.buttonState = ''
				//di下拉
				this.diList = []
				// 数据流图文件上传
				this.fileLists = []
				//架构图文件上传
				this.RpaSystemFileLists = []
				// 加载RPA下拉
				const { data: rpaListData } = await rpaSelectLists()
				this.rpaListData = rpaListData
				// 加载DPIA下拉
				const { data: dpiaSelectListsData } = await dpiaSelectLists()
				this.dpiaSelectListsData = dpiaSelectListsData
				// 存放地
				const { data: fonfigurationItemsContent } =
					await configurationSelect({
						state: 4,
					})
				this.fonfigurationItemsContent = fonfigurationItemsContent
				
			console.log('this.fonfigurationItemsContent',this.fonfigurationItemsContent)
			
				// 进入加载
				this.loading = true
				//数据详情的数据字段
				const { data: dataItemsSearchData } = await dccDataItemsSelect({
					types: 1,
				})
				this.dataItemsSearchData = []
				this.dataItemsSearchData = dataItemsSearchData
				// 获取入参
				const stateCode = this.$route.query.state
				const id = this.$route.query.id
				if (stateCode == 'add') {
					this.pageTitle =
						'user.verification-code.required111566110577134'
					this.types = false
					await this.$nextTick()
					/**
					 * 初始化DPIA的弹窗跟RPA的数据内容
					 * 没有写入的内容都是undefind,保证都初始化过
					 * @type {{RpaId: any, Id: any}}
					 */
					// this.initFromData = {
					//   ...{
					//     RpaId: data.RpaId,
					//     Id: data.Id,
					//   },
					// };
					this.initDpiaFromData = {
						...{
							DpiaRpaId: this.DpiaRpaId,
							DpiaName: 'DPIA-' + this.DpiaRpaId,
						},
					}

					await this.$nextTick()
					// 赋值行为
					this.form.setFieldsValue(this.initFromData)
					this.form1.setFieldsValue(this.initDpiaFromData)
					// 绑定内容
					// this.DpiaRpaId = data.RpaId;
					// this.rpaId = data.Id;
				} else if (stateCode === 'edit') {
					// this.pageTitle = 'user.verification-code.required111566110577135'
					this.types = true
					this.createQuestionStatus = false
					const Re = this.$route.query.Re
					this.Re = this.$route.query.Re
					if (this.$route.query.Re == 1) {
						this.pageTitle =
							'user.verification-code.required1115661105771351'
					} else {
						this.pageTitle =
							'user.verification-code.required111566110577135'
					}
					// 修改
					try {
						// 读取数据
						this.rpaId = id
						this.rpaidd = id
						await this.$nextTick()
						const { data: rpaInfo } = await rpaDetail({ Id: id })
						console.log('編輯', rpaInfo)
						if (rpaInfo.RpaNoPIOrImportantInvolved == 1) {
							rpaInfo.RpaNoPIOrImportantInvolved = true
						} else {
							rpaInfo.RpaNoPIOrImportantInvolved = false
						}
						this.NonPIedit = rpaInfo.RpaNoPIOrImportantInvolved
						this.PIAedit = rpaInfo.RpaIfCompletedPIA
						this.dataDetailInfoTablesEdit = rpaInfo.RpaDataDetail
						this.RpaActivityCycle = rpaInfo.RpaActivityCycle //数据处理活动阶段
						this.RpaActivityType = rpaInfo.RpaActivityType //数据处理活动类型
						rpaInfo.RpaDataDetail
							? rpaInfo.RpaDataDetail.forEach((item) => {
									item.DataItemsStr =
										item.DataItem === 0
											? undefined
											: item.DataItem
							  })
							: ''
						this.rpaInfo = rpaInfo
						this.initFromData = rpaInfo

						// this.rpaId = id
						// 回显本业务是否涉及线上系统或平台
						this.changvalue = rpaInfo.RpaCollectionChannels
						if (
							rpaInfo.RpaObjective === '其他【请补充说明】' ||
							rpaInfo.RpaObjective === 'bussic.target.h'
						) {
							this.otherPurpose = true
						} else {
							this.otherPurpose = false
						}
						if (rpaInfo.RpaLeaderRetinue) {
							this.userList.push(
								{
									value: rpaInfo.RpaLeaderMaster,
									label: rpaInfo.RpaLeaderMasterStr,
								},
								{
									value: rpaInfo.RpaLeaderRetinue,
									label: rpaInfo.RpaLeaderRetinueStr,
								}
							)
						} else {
							this.userList.push({
								value: rpaInfo.RpaLeaderMaster,
								label: rpaInfo.RpaLeaderMasterStr,
							})
						}

						if (rpaInfo.RpaUpload) {
							rpaInfo.RpaUpload.forEach((item, index) => {
								if (item.RpaUploadType == 1) {
									let name =
										item.RpaUploadUrl.split('/').slice(-1)
									this.fileLists.push({
										Id: item.Id,
										uid: index,
										name: name,
										status: 'done',
										url: item.RpaUploadUrl,
										RpaUploadType: 1,
									})
								} else {
									let name =
										item.RpaUploadUrl.split('/').slice(-1)
									this.RpaSystemFileLists.push({
										Id: item.Id,
										uid: index,
										name: name,
										status: 'done',
										url: item.RpaUploadUrl,
										RpaUploadType: 2,
									})
								}
							})
						}
						rpaInfo.RpaActivityCycle = this.strToInt(
							rpaInfo.RpaActivityCycle.split(',')
						)
						rpaInfo.RpaActivityType = this.strToInt(
							rpaInfo.RpaActivityType.split(',')
						)
						let RpaDataController = []
						if (rpaInfo.RpaDataControllerOther != '') {
							this.otherflag = true
						} else if (rpaInfo.RpaDataControllerOther == '') {
							this.otherflag = false
						}
						if (rpaInfo.RpaDataController) {
							rpaInfo.RpaDataController.split(',').forEach(
								(item) => {
									RpaDataController.push(parseInt(item))
								}
							)
						}
						// 新功能
						const { data: systemControllerSourceData } =
                        await configurationSelect({
                            state: 11,
						})
						if(rpaInfo.RpaDataControllerOther == ''){
							this.Others = []
						} else {
							this.Others = rpaInfo.RpaDataControllerOther.split(",")
						}
						let arr = []
						systemControllerSourceData.map(item => {
						RpaDataController.map((it)=>{
								if (it == item.value){
									arr.push(item.label)
								}
							})
						})
						console.log(systemControllerSourceData, '123')
						console.log(RpaDataController, '1232')
						this.RpaDataTay = arr.concat(this.Others)
						// 数据控制者
						rpaInfo.RpaDataController = RpaDataController
							? RpaDataController
							: undefined
						//业务主负责人
						rpaInfo.RpaLeaderMaster = rpaInfo.RpaLeaderMaster
							? rpaInfo.RpaLeaderMaster
							: undefined
						// 处理活动周期
						rpaInfo.RpaProcessingActivityCycle =
							rpaInfo.RpaProcessingActivityCycle
								? rpaInfo.RpaProcessingActivityCycle
								: undefined
						// 处理活动的系统或网络环境
						rpaInfo.RpaSystemNetwork = parseInt(
							rpaInfo.RpaSystemNetwork
						)
							? parseInt(rpaInfo.RpaSystemNetwork)
							: undefined
						// 涉及个人信息主体的数量
						rpaInfo.RpaNumber =
							rpaInfo.RpaNumber == 0
								? undefined
								: rpaInfo.RpaNumber
						// 涉及敏感个人信息主体的数量
						rpaInfo.RpaSensitiveNumber =
							rpaInfo.RpaSensitiveNumber == 0
								? undefined
								: rpaInfo.RpaSensitiveNumber
						// 本次业务活动是否涉及线上处理活动
						rpaInfo.RpaCollectionChannels =
							rpaInfo.RpaCollectionChannels == 0
								? undefined
								: rpaInfo.RpaCollectionChannels
						// rpaInfo.RpaLeaderMaster = parseInt(rpaInfo.RpaLeaderMaster)
						rpaInfo.RpaLeaderRetinue = rpaInfo.RpaLeaderRetinue
							? rpaInfo.RpaLeaderRetinue
							: undefined
						if (Array.isArray(rpaInfo.RpaDataDetail)) {
							//数据详情里面的城市，数据来源 ，数据目的地
							let arr = []
							this.tempId = 1
							rpaInfo.RpaDataDetail.forEach((item) => {
								// item.DataDeposit = parseInt(item.DataDeposit)
								//目的地
								if (item.Id === 0) {
									item.tempId = ++this.tempId
								}
								if (item.DataDeposit) {
									item.DataDeposit = item.DataDeposit.split(
										','
									).reduce((pre, cur) => {
										pre.push(parseInt(cur))
										return pre
									}, [])
								} else {
									item.DataDeposit = undefined
								}
								// item.DataCity = parseInt(item.DataCity)
								//城市
								if (item.DataCity) {
									item.DataCity = item.DataCity.split(
										','
									).reduce((pre, cur) => {
										pre.push(parseInt(cur))
										return pre
									}, [])
								} else {
									item.DataCity = undefined
								}
								// item.DataDestination = parseInt(item.DataDestination)
                                //数据字段
                                if (item.DataItemStr) {
                                    if (localStorage.getItem('lang') == '"zh-CN"') {
                                    this.filterSearchInputOption(item.DataItemStr)
                                    } else if (localStorage.getItem('lang') == '"zh-EN"') {
                                    this.filterSearchInputOptionEn(item.DataItemStr)
                                    }
                                }
								//目的地
								if (item.DataDestination) {
									item.DataDestination =
										item.DataDestination.split(',').reduce(
											(pre, cur) => {
												pre.push(parseInt(cur))
												return pre
											},
											[]
										)
								} else {
									item.DataDestination = undefined
								}
								if (item.DataDestinationStr) {
									let DataDestinationStr =
										item.DataDestinationStr.split(',')
									DataDestinationStr.map((item) => {
										this.appIdCreatexlFz(item)
									})
								}
								if (item.SourceStr) {
									let SourceStr = item.SourceStr.split(',')
									SourceStr.map((item) => {
										this.appIdCreatexlFz(item)
									})
								}
								//数据来源
								if (item.DataSource) {
									item.DataSource = item.DataSource.split(
										','
									).reduce((pre, cur) => {
										pre.push(parseInt(cur))
										return pre
									}, [])
								} else {
									item.DataSource = undefined
								}
								arr.push(item)
							})
							this.diDataLists = arr
							console.log('arrrrr', arr)
							// this.diList=[...new Set(this.arr11)]
							console.log('this.diList', this.diList)
						}
						await this.$nextTick()
						if (!rpaInfo.RpaObjective) {
							rpaInfo.RpaObjective = undefined
						}
						this.form.setFieldsValue(rpaInfo)
					} catch (error) {
						this.$message.error(error)
						console.log(error)
					} finally {
						this.loading = false
					}
				} else {
					this.types = true
					this.createQuestionStatus = false
					this.disabled = true

					// 查看
					try {
						// 读取数据
						this.pageTitle = 'rpa.detail'
						this.rpaId = id
						const { data: rpaInfo } = await rpaDetail({ Id: id })
						console.log('查看', rpaInfo)
						if (rpaInfo.RpaNoPIOrImportantInvolved == 1) {
							rpaInfo.RpaNoPIOrImportantInvolved = true
						} else {
							rpaInfo.RpaNoPIOrImportantInvolved = false
						}
						this.rpaInfo = rpaInfo
						this.initFromData = rpaInfo
						rpaInfo.RpaDataDetail
							? rpaInfo.RpaDataDetail.forEach((item) => {
									item.DataItemsStr =
										item.DataItem === 0
											? undefined
											: item.DataItem
							  })
							: ''

						// 获得列表数据 不走这步会全部是数字
						// const { data: appidLists } = await appIdCreatexl({
						// 	content: '',
						// 	types: 1,
						// 	page: this.pageNo,
						// 	pageSize: this.pageSize
						// })
						// this.appidLists = appidLists

						if (rpaInfo.RpaUpload) {
							rpaInfo.RpaUpload.forEach((item, index) => {
								if (item.RpaUploadType == 1) {
									let name =
										item.RpaUploadUrl.split('/').slice(-1)
									this.fileLists.push({
										Id: item.Id,
										uid: index,
										name: name,
										status: 'done',
										url: item.RpaUploadUrl,
									})
								} else {
									let name =
										item.RpaUploadUrl.split('/').slice(-1)
									this.RpaSystemFileLists.push({
										Id: item.Id,
										uid: index,
										name: name,
										status: 'done',
										url: item.RpaUploadUrl,
									})
								}
							})
						}
						this.fileLists.forEach((item) => {
							let itemName = item.name[0]
							this.listNameArr.push(itemName)
						})
						this.RpaSystemFileLists.forEach((item) => {
							let itemName2 = item.name[0]
							this.listNameArr2.push(itemName2)
						})

						rpaInfo.RpaActivityCycle = this.strToInt(
							rpaInfo.RpaActivityCycle.split(',')
						)
						rpaInfo.RpaActivityType = this.strToInt(
							rpaInfo.RpaActivityType.split(',')
						)
						let RpaDataController = []
						if (rpaInfo.RpaDataControllerOther != '') {
							this.otherflag = true
						} else if (rpaInfo.RpaDataControllerOther == '') {
							this.otherflag = false
						}
						if (rpaInfo.RpaDataController) {
							rpaInfo.RpaDataController.split(',').forEach(
								(item) => {
									RpaDataController.push(parseInt(item))
								}
							)
						}
						// 回显本业务是否涉及线上系统或平台
						this.changvalue = rpaInfo.RpaCollectionChannels
						if (
							rpaInfo.RpaObjective === '其他【请补充说明】' ||
							rpaInfo.RpaObjective === 'bussic.target.h'
						) {
							this.otherPurpose = true
						} else {
							this.otherPurpose = false
						}
						await this.$nextTick()

						// 新功能
						const { data: systemControllerSourceData } =
                        await configurationSelect({
                            state: 11,
						})
						if(rpaInfo.RpaDataControllerOther == ''){
							this.Others = []
						} else {
							this.Others = rpaInfo.RpaDataControllerOther.split(",")
						}
						let arr = []
						systemControllerSourceData.map(item => {
						RpaDataController.map((it)=>{
								if (it == item.value){
									arr.push(item.label)
								}
							})
						})
						console.log(systemControllerSourceData, '123')
						console.log(RpaDataController, '1232')
						this.RpaDataTay = arr.concat(this.Others)
						// 数据控制者
						rpaInfo.RpaDataController = RpaDataController
							? RpaDataController
							: undefined
						//业务主负责人
						if (rpaInfo.RpaLeaderMasterStr === '') {
							rpaInfo.RpaLeaderMaster = undefined
						} else {
							rpaInfo.RpaLeaderMaster = rpaInfo.RpaLeaderMaster
								? rpaInfo.RpaLeaderMaster
								: undefined
						}
						// 处理活动周期
						rpaInfo.RpaProcessingActivityCycle =
							rpaInfo.RpaProcessingActivityCycle
								? rpaInfo.RpaProcessingActivityCycle
								: undefined
						// 处理活动的系统或网络环境
						rpaInfo.RpaSystemNetwork = parseInt(
							rpaInfo.RpaSystemNetwork
						)
							? parseInt(rpaInfo.RpaSystemNetwork)
							: undefined
						// 涉及个人信息主体的数量
						rpaInfo.RpaNumber =
							rpaInfo.RpaNumber == 0
								? undefined
								: rpaInfo.RpaNumber
						// 涉及敏感个人信息主体的数量
						rpaInfo.RpaSensitiveNumber =
							rpaInfo.RpaSensitiveNumber == 0
								? undefined
								: rpaInfo.RpaSensitiveNumber
						// 本次业务活动是否涉及线上处理活动
						rpaInfo.RpaCollectionChannels =
							rpaInfo.RpaCollectionChannels == 0
								? undefined
								: rpaInfo.RpaCollectionChannels
						// rpaInfo.RpaLeaderMaster = parseInt(rpaInfo.RpaLeaderMaster)
						rpaInfo.RpaLeaderRetinue = rpaInfo.RpaLeaderRetinue
							? rpaInfo.RpaLeaderRetinue
							: undefined
						this.form.setFieldsValue(rpaInfo)
						if (Array.isArray(rpaInfo.RpaDataDetail)) {
							//数据详情里面的城市，数据来源 ，数据目的地
							let arr = []
							// 给数据详情赋值

							rpaInfo.RpaDataDetail.forEach((item) => {
								// item.DataDeposit = parseInt(item.DataDeposit)
								//目的地
								if (item.DataDeposit) {
									item.DataDeposit = item.DataDeposit.split(
										','
									).reduce((pre, cur) => {
										pre.push(parseInt(cur))
										return pre
									}, [])
								} else {
									item.DataDeposit = undefined
								}
								// item.DataCity = parseInt(item.DataCity)
								//城市
								if (item.DataCity) {
									item.DataCity = item.DataCity.split(
										','
									).reduce((pre, cur) => {
										pre.push(parseInt(cur))
										return pre
									}, [])
								} else {
									item.DataCity = undefined
								}
								// item.DataDestination = parseInt(item.DataDestination)
                                //数据字段
                                if (item.DataItemStr) {
                                    if (localStorage.getItem('lang') == '"zh-CN"') {
                                    this.filterSearchInputOption(item.DataItemStr)
                                    } else if (localStorage.getItem('lang') == '"zh-EN"') {
                                    this.filterSearchInputOptionEn(item.DataItemStr)
                                    }
                                }
								//目的地

								if (item.DataDestination) {
									item.DataDestination =
										item.DataDestination.split(',').reduce(
											(pre, cur) => {
												pre.push(parseInt(cur))
												return pre
											},
											[]
										)
								} else {
									item.DataDestination = undefined
								}
								if (item.DataDestinationStr) {
									let DataDestinationStr =
										item.DataDestinationStr.split(',')
									DataDestinationStr.map((item) => {
										this.appIdCreatexlFz(item)
									})
								}
								if (item.SourceStr) {
									let SourceStr = item.SourceStr.split(',')
									SourceStr.map((item) => {
										this.appIdCreatexlFz(item)
									})
								}
								//数据来源
								if (item.DataSource) {
									item.DataSource = item.DataSource.split(
										','
									).reduce((pre, cur) => {
										pre.push(parseInt(cur))
										return pre
									}, [])
								} else {
									item.DataSource = undefined
								}

								arr.push(item)
							})
							this.diDataLists = arr
						}
						// 没有值的时候是空
					} catch (error) {
						this.$message.error(error)
						console.log(error)
					} finally {
						this.loading = false
					}
				}
				// 加载数据控制者数据
				const { data: systemControllerSourceData } =
					await configurationSelect({
						state: 11,
					})

				/**
				 * 1、加载收集渠道数据
				 * 2、加载数据处理活动周期
				 * 3、加载数据处理活动类型
				 */
				const {
					collectionChannelsSourceData,
					dataProcessingActivityCycleData,
					processingActivityTypesData,
				} = await getSourceData(this.$route.query.itLang)
				this.collectionChannelsSourceData = collectionChannelsSourceData
				this.dataProcessingActivityCycleData =
					dataProcessingActivityCycleData
				this.processingActivityTypesData = processingActivityTypesData

				// 加载数据资产名称APP名称下拉
				const { data: rpaSelectAssetNameData } =
					await rpaSelectAssetName()
				// 城市
				const { data: sonfigurationItemsContent } =
					await configurationSelect({
						state: 3,
					})

				this.sonfigurationItemsContent = sonfigurationItemsContent
				this.systemControllerSourceData = systemControllerSourceData
				this.collectionChannelsSourceData = collectionChannelsSourceData
				this.rpaSelectAssetNameData = rpaSelectAssetNameData
				setTimeout(() => {
					this.changeselect(this.rpaInfo.RpaDataController)
				})
				if (stateCode === 'detail') {
					// 详情,打开数据返显
					this.detailStatus = true
				}
			} catch (error) {
				this.$message.error(error)
				console.log(error)
			} finally {
				this.loading = false
			}
		},

		async rollback() {
			this.del == '0'
			this.ifFlag = true
			// if (this.$route.query.state == "add") {
			//   await rpaDelcsai({ Id: this.rpaId });
			// }
			this.$router.push(this.toPage || '/rpa/service')
			// this.$message.warning(this.$t("app.setting.themecolor.rr100"));
		},
		async appIdCreatexlFz(val) {
			const { data: appidLists } = await appIdCreatexl({
				content: val,
				types: 1,
			})
			this.appidLists = this.appidLists.concat(appidLists)
			const arr = this.appidLists.concat(appidLists);
            const result = Array.from(new Set(arr.map(item => JSON.stringify(item)))).map(item => JSON.parse(item));
            this.appidLists = result;
		},
		// 分页
		handleTableChange(pagination) {
			let didlength = this.diDataLists.length
			let newli =  (pagination.current-1)*5
			let essli =  (pagination.current-1)*5+5
			const arr = this.diDataLists
     		const newArr = arr.slice(newli,essli);
			newArr.map((item) => {
				//数据字段
				//数据字段
				if (item.DataItem) {
					if (localStorage.getItem('lang') == '"zh-CN"') {
						childataItems({ id: item.DataItemsStr }).then((res) => {
							if(res.data.length > 0){
								this.filterSearchInputOption(res.data[0].SourceChildNameEn)
							}
						})
					} else if (localStorage.getItem('lang') == '"zh-EN"') {
						// this.filterSearchInputOptionEn(item.DataItemStr)
						childataItems({ id: item.DataItemsStr }).then((res) => {
							if(res.data.length > 0){
								this.filterSearchInputOptionEn(res.data[0].SourceChildNameEn)
							}
						})
					}
				} else {
					
				}
				if (item.DataDestinationStr) {
					let DataDestinationStr =
						item.DataDestinationStr.split(',')
						DataDestinationStr.map((item) => {
							this.appIdCreatexlFz(item)
						})
					}	
				if (item.SourceStr) {
					let SourceStr = item.SourceStr.split(',')
						SourceStr.map((item) => {
							this.appIdCreatexlFz(item)
						})
					}
			})
		},
		//文件上传
		async handleChange(e) {
			console.log(e)
			// 上传提交
			this.uploadLoading = true
			let formdata = new FormData()
			formdata.append('file', e.file)
			try {
				const { status, data } = await axios({
					url: `${this.env}/v1/oss/upload`,
					method: 'post',
					data: formdata,
					headers: {
						token: storage.get(ACCESS_TOKEN),
						tokens: storage.get('bmwToken') || '',
					},
				})
				if (status === 200 && data.code == 1) {
					if (data.data != '') {
						await this.$nextTick()
						var files = data.data
						var index = this.fileLists.length
						if (files != '' && files != undefined) {
							var fileName = files.split('/')
							this.fileLists.push({
								uid: index + 1,
								name: fileName[fileName.length - 1],
								status: 'done',
								url: data.Url + data.data,
								RpaUploadType: 1,
							})
						}
					}
					this.$message.success(
						this.$t('user.verification-code.successfullyupload')
					)
				} else {
					this.$message.error('上传失败')
				}
			} catch (error) {
				console.log(error)
				this.$message.error(error)
			} finally {
				this.uploadLoading = false
			}
			console.log(this.fileLists)
		},
		beforeUpload(file) {
			const isFormatAllowed = [
				'png',
				'jpg',
				'jpeg',
				'gif',
				'txt',
				'pdf',
				'doc',
				'docx',
				'xlsx',
				'xls',
				'ppt',
				'pptx',
				'vsd',
				'vsdx',
				'vssx',
				'vstx',
				'vsdm',
				'vssm',
				'vstm',
				'zip',
				'tar',
				'rar',
				'msg',
			].includes(file.name.split('.').pop())
			// console.log('123',isFormatAllowed);
			if (!isFormatAllowed) {
				this.$message.error(
					this.$t('user.verification-code.supportformat')
				)
			}
			const isSizeAllowed = file.size / 1024 / 1024 < 20 // 小于20MB
			// console.log('123', file.size / 1024 / 1024)

			if (!isSizeAllowed) {
				this.$message.error(
					this.$t('user.verification-code.filesizeout')
				)
			}
			return isFormatAllowed && isSizeAllowed
		},
		//删除上传文件
		async fn(file) {
			console.log('1')
			console.log('file', file)

			const index = this.fileLists.indexOf(file)
			this.fileLists.splice(index, 1)
			await rpaFileDelete({ Id: file.Id })
			return true
		},
		async RpaSystemHandleChange(e) {
			// 架构图上传提交
			this.uploadLoading = true
			let formdata = new FormData()
			formdata.append('file', e.file)
			try {
				const { status, data } = await axios({
					url: `${this.env}/v1/oss/upload`,
					method: 'post',
					data: formdata,
					headers: {
						token: storage.get(ACCESS_TOKEN),
						tokens: storage.get('bmwToken') || '',
					},
				})
				if (status === 200 && data.code === 1) {
					if (data.data !== '') {
						await this.$nextTick()
						var files = data.data
						var index = this.RpaSystemFileLists.length
						if (files !== '' && files !== undefined) {
							var fileName = files.split('/')
							this.RpaSystemFileLists.push({
								uid: index + 1,
								name: fileName[fileName.length - 1],
								status: 'done',
								url: data.Url + data.data,
								RpaUploadType: 2,
							})
						}
					}
					this.$message.success(
						this.$t('user.verification-code.successfullyupload')
					)
				} else {
					this.$message.error('上传失败')
				}
			} catch (error) {
				this.$message.error(error)
			} finally {
				this.uploadLoading = false
			}
		},
		async fn1(file) {
			const index = this.RpaSystemFileLists.indexOf(file)
			this.RpaSystemFileLists.splice(index, 1)
			await rpaFileDelete({ Id: file.Id })
			return true
		},
		//新增数据字段弹窗关闭
		closeDataFields() {
			this.showDataFields = false
		},
		radioChange() {
			if (this.radioValue == 2) {
				this.disabled1 = true
				this.radioValueCheck = true
				this.diId = ''
			} else {
				this.disabled1 = false
			}
		},
		//数据控制者是否出现other获取
		changeselect(value) {
			if (value) {
				let item2 = []
				value.forEach((item) => {
					this.systemControllerSourceData.forEach((item1) => {
						if (item == item1.value) {
							item2.push(item1.label)
						}
					})
				})

				if (item2.includes('Other')) {
					this.otherflag = true
				} else {
					this.otherflag = false
				}
			}
		},
		changePurposeSelect(val) {
			if (val === 'bussic.target.h') {
				this.otherPurpose = true
			} else {
				this.otherPurpose = false
			}
		},
        hideDropdown() {
            this.isHovered =false
			// if (this.$refs.select && !this.$refs.select.$el.contains(event.target)) {
			// 	this.selectOpen = false;
			// }
		},
		async positionSearch(content) {
			let { data } = await configurationItemsFind({
				content,
				state: 4,
				types: this.lang === 'zh-CN' ? undefined : 1,
			})
			console.log('我是data',data)
			this.fonfigurationItemsContent = data

		},
		batchup() {
			this.ifLoading = true
			this.batchUpForm.resetFields()
			this.checkedValues = []
			this.batchVisible = true
			this.ifLoading = false
		},
		onSelectChange(selectedRowKeys) {
			this.selectedRowKeys = selectedRowKeys
		},
		onChange(checkedValues) {
			this.checkedValues = checkedValues
			this.btnDisabled = false
			this.$nextTick(() => {
				checkedValues.forEach((element) => {
					let item = this.batchUpForm.getFieldValue(element)
					if (
						item === undefined ||
						!item ||
						(item instanceof Array && !item.length)
					) {
						this.btnDisabled = true
					}
				})
			})
		},
		close() {
			this.batchVisible = false
		},
		submit() {
			let changeList = this.batchUpForm.getFieldsValue(this.checkedValues)
			this.diDataLists.forEach((item) => {
				if (this.selectedRowKeys.includes(item.Id)) {
					for (const key in changeList) {
						item[key] = changeList[key]
					}
				}
			})
			this.close()
		},
		onSelectAll(ifAll) {
			if (ifAll) {
				this.selectedRowKeys = this.diDataLists.map((item) => {
					return item.Id
				})
			} else {
				this.selectedRowKeys = []
			}
		},
		  //新需求
		  hoverOver() {
            this.isHovered = true;
        },
        handleClose(removedTag) {
            const RpaDataTay = this.RpaDataTay.filter(tag => tag !== removedTag);
            const Others = this.Others.filter(tag => tag !== removedTag);
            this.RpaDataTay = RpaDataTay;
            this.Others = Others;
            console.log(this.RpaDataTay)
            console.log(this.Others)
        },
        showInput() {
            this.inputVisible = true;
            this.$nextTick(function() {
                this.$refs.input.focus();
            });
        },

        handleInputChange(e) {
            this.inputValue = e.target.value;
        },

        handleInputConfirm() {
            const inputValue = this.inputValue;
            let RpaDataTay = this.RpaDataTay;
            let Others = this.Others
            if (inputValue && RpaDataTay.indexOf(inputValue) === -1) {
                RpaDataTay = [...RpaDataTay, inputValue];
                Others=  [...Others,inputValue]
            }
            Object.assign(this, {
                RpaDataTay,
                Others,
                inputVisible: false,
                inputValue: '',
            });
        },
        hoverOut(items) {
            if (items.label == "Other"){
                this.inputVisible = true;
                this.isHovered = false;
                this.$nextTick(function() {
                    this.$refs.input.focus();
                });
            } else{
                let RpaDataTay = this.RpaDataTay;
                if (RpaDataTay.indexOf(items.label) === -1) {
                    RpaDataTay = [...RpaDataTay, items.label];
                }
                this.RpaDataTay = RpaDataTay
                this.isHovered = false;
            }
        }
	},
	// 路由守卫监听离开当前页面的操作
	beforeRouteLeave(to, from, next) {
		// 当查看时可以直接返回，或者保存后可以返回
		this.toPage = to
		if (this.disabled || this.ifFlag) {
			next() // Allow the navigation to proceed
		} else {
			this.ifvisible = true
			next(false) // Prevent the navigation
		}
	},

	beforeDestroy() {
		clearTimeout(this.timer) // 清除定时器
		// 取消请求（如果使用 axios）
		if (this.cancelToken) {
			this.cancelToken.cancel('组件被销毁')
		}
	},
}
</script>
<style lang="less" scoped>
.Div_ler{
    padding: 0 10px;
    min-height: 32px;
    overflow: overlay;
}
/*placeholder颜色 */
.Div_ler:empty:before {
  content: attr(placeholder);
  color: #999;
}
/*文本框不为空时， placeholder设置为none*/
.Div_ler:focus:placeholder-shown {
  content: none;
}
.Ul_st{
    position: absolute;
    z-index: 100;
    background: #fff;
    width: 390px;
    border: 1px solid #ccc;
    border-radius: 5px;
    cursor: pointer; /* 鼠标指针变为手形 */
}
.Ulli{
    padding: 0 10px;
}
.Ulli:hover{
    background-color: #e6f7ff;
}
</style>
<style lang="less" scoped>
.header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 30px;
}

.card {
	display: flex;
	align-items: center;
	border-radius: 8px;
	box-shadow: 2px 5px 5px rgba(0, 0, 0, 0.3);
	padding: 20px;
	padding-right: 150px;

	h4 {
		font-size: 30px;
	}

	p {
		font-size: 16px;
		color: #999;
	}
}

/deep/ .drawer-form {
	margin-bottom: 50px;

	.ant-form-item {
		margin-right: 10px;
	}

	.ant-form-item-label {
		display: inline-block;
		line-height: 20px;
		width: 100px;
		margin-right: 10px;
		margin-top: 10px;
		margin-left: 10px;
	}
}

.checkbox {
	background: #eee;
	padding: 10px;
	margin-top: 16px;
	position: relative;
	top: -10px;
	left: -10px;

	.ant-form-item-label {
		display: inline-block;
		line-height: 40px;
		width: 150px;
		// margin-right: 10px;
	}
}

/deep/ .ant-table-thead {
	background: #f4f7ff;
	font-weight: 700;
}

.import-butoon {
	margin-top: 13px;
}

.table-di {
	margin-top: 13px;
}

.ty {
	width: 13px;
	height: 13px;
	opacity: 1;
	background: rgba(255, 255, 255, 1);
	border: 4px solid #5076a5;
	border-radius: 50%;
}

.tags {
	left: 298px;
	top: 288px;
	width: 6px;
	height: 14px;
	opacity: 1;
	border-radius: 2px;
	background: rgba(0, 80, 247, 1);
}

/deep/ .shuju {
	margin-left: 10px !important;
}

/deep/ [data-v-23a62919] .drawer-form .ant-form-item {
	margin-right: 90px !important;
}

/deep/ [data-v-23a62919] .drawer-form .ant-form-item-label {
	display: inline-block;
	line-height: 20px;
	width: 100px;
	margin-right: 10px;
	margin-top: 10px;
	margin-left: 10px;
	overflow: visible !important;
}

/deep/ element.style {
	width: 178px;
	margin-left: 160px !important;
}

/deep/ .drawer-form .ant-form-item-label {
	display: inline-block;
	line-height: 20px;
	width: 145px !important;
	margin-right: 10px;
	margin-top: 10px;
	margin-left: 10px;
	overflow: visible !important;
}

.zhushi {
	background-color: skyblue;
	float: left;
	z-index: 99;
	width: 200px;
	position: absolute;
	top: -40px;
	left: 662px;
}

.a-checkbox-group {
	display: flex;
	flex-direction: row;
}

.a-checkbox-group-1 {
	display: flex;
	flex-direction: column;
}
.dlex {
	display: flex;
	justify-content: space-evenly;
}

.conter {
	position: relative;
}

.letop {
	position: absolute;
	top: -40px;
	left: 30px;
	z-index: 15;
}

.title-content {
	text-align: center;

	.little-tag {
		font-size: 14px;

		.blue-content {
			color: #1940b4;
		}

		max-width: 284px;
		transform: scale(0.9);
	}
}

:deep(.ant-form-item) {
	margin-bottom: 0;
}

.batchup-btn {
	margin-top: 10px;
	margin-left: -10px;
}

.ant-checkbox-group {
	width: 100%;
}

.ant-form {
	margin-top: 10px;

	:deep(.flex-row) {
		display: flex;
		justify-content: center;
		align-items: center;
		width: 100%;

		.ant-checkbox {
			width: 20px;
		}

		.ant-form-item {
			margin-bottom: 0;
			flex: 1;
			display: flex;
			align-items: center;

			.ant-col.ant-form-item-control-wrapper {
				width: 41.66666667%;
				display: block;
			}
		}
	}
}

.line {
	width: 100%;
	height: 1px;
	margin: 10px 0 10px -10px;
	background-color: #9a9a9a;
}

:deep(.ant-descriptions-view) {
	.ant-descriptions-item-label,
	.ant-descriptions-item-content {
		color: #9a9a9a;
	}
}

.big-box {
	width: 100vw;
	height: 100vh;
	background-color: rgba(0, 0, 0, 0.7);
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9999999;
	display: flex;
	justify-content: center;
	align-items: center;
}

// .long-text {
//   white-space: normal;
//   /* 使用该属性允许文本换行 */
//   word-wrap: break-word;
// }
.ant-form-vertical .ant-form-item {
	padding-bottom: 0px;
}

:deep .ant-upload-list-item-name {
	width: auto;
}

:deep .ant-upload-list-item-card-actions {
	right: auto;
}

</style>
